Inspect attached event handlers for any DOM element

Question

Is there any way to view what functions / code are attached to any event for a DOM element? Using Firebug or any other tool.

Answer 1

Event handlers attached using traditional element.onclick= handler or HTML <element onclick="handler"> can be retrieved trivially from the element.onclick property from script or in-debugger.

Event handlers attached using DOM Level 2 Events addEventListener methods and IE's attachEvent cannot currently be retrieved from script at all. DOM Level 3 once proposed element.eventListenerList to get all listeners, but it is unclear whether this will make it to the final specification. There is no implementation in any browser today.

A debugging tool as browser extension could get access to these kinds of listeners, but I'm not aware of any that actually do.

Some JS frameworks leave enough of a record of event binding to work out what they've been up to. Visual Event takes this approach to discover listeners registered through a few popular frameworks.