admin管理员组

文章数量:1196136

Is there a way to find what event handlers are attached to a given DOM node?

For example, when you click the "add comment" link, there's an event handler attached to it which shows the comment form. Now, if I have a DOM document (a web page), and want to list all the event handlers for one specific node, is there a way to do this?

(I suspect that it's not possible for JS running within the page; do browser extensions in FF have access to this data?)

Is there a way to find what event handlers are attached to a given DOM node?

For example, when you click the "add comment" link, there's an event handler attached to it which shows the comment form. Now, if I have a DOM document (a web page), and want to list all the event handlers for one specific node, is there a way to do this?

(I suspect that it's not possible for JS running within the page; do browser extensions in FF have access to this data?)

Share Improve this question asked Nov 30, 2010 at 13:21 Piskvor left the buildingPiskvor left the building 92.8k46 gold badges179 silver badges226 bronze badges 2
  • Take a look at this question: stackoverflow.com/questions/446892/… – McStretch Commented Nov 30, 2010 at 13:25
  • @McStretch: Useful, thank you. Didn't find that before, voting to close this as duplicate. – Piskvor left the building Commented Nov 30, 2010 at 13:42
Add a comment  | 

3 Answers 3

Reset to default 12

Chrome (and I suspect Safari) can show attached event listeners when you select an element in the DOM and then scroll down the right sidebar to the Event Listeners section. There, you can see which functions are attached.

I don't have a copy of Firebug at the moment, but I suspect the DOM tab to show similar information in Firefox as well.

In Chrome, you can use getEventListeners.

  1. Open Developer Tools
  2. Select the element you're interested in
  3. Type this the console: getEventListeners($0)
  4. Hit enter.

An object mapping event names to their handlers should be returned. Note that $0 is a special dev tools variable which always points to the last element selected in the "Elements" tabs.

In Chrome:

  1. "Inspect Element" on the element you want to know about
  2. In the "Elements" tab in developer tools, in the right-hand pane, click on "Event Listeners"

This will show you what event handlers are attached to that element.

(Krof's answer could have been more clearly written.)

本文标签: javascriptWhat event handlers are attached to a DOM nodehow to findStack Overflow