Showing usage of Event Listeners Tab

Let’s use the Event Listeners Tab for the GFG site to check various event listeners of elements and remove them or filter out specific events.

• Step 1: Using the Chrome browser, visit the GFG site and open the DevTools.
• Step 2: In the DevTools, click the Select An Element option to focus on the element whose event listeners are to be viewed.
• Step 3: In the Event Listeners tab, expand the event categories and remove individual events. You can right-click the event and set it as passive.
• Step 4: Filter the events as passive or blocked. or check Ancestors to view all events of the ancestors of the selected element.

A web page may have many elements that event listeners associate with it. All these event listeners can be viewed and linked to their respective JS files in the Sources tab using the Event Listeners tab present in the Elements Tool of DevTools.

The Event Listeners Tab is present in the Elements tool in Chrome and is used to check various event listeners of the elements present in the web page. You get various options, such as filter, refresh, include ancestors, and many more, in the context menu.