Sen Jacob Sen Jacob - 13 days ago 6
Javascript Question

View DOM level 2 Event handlers in IE

Is there any way to view DOM level 2 event listeners added to a DOM element in IE 9+?

In Chrome, we can see attached events from console using getEventListeners(object).

I tried Visual Events, but it only displays DOM level 0 events.

In case if you are wondering, I need to list the attached event handlers to window unload event and debug which events are fired to find out which one is causing an exception/preventing propagation. The unload event handler is getting dispatched properly in Chrome.

Answer

Yes, you can easily see DOM2 handlers:

  • Right-click the element with the event handler and choose Inspect Element

  • That should trigger the DOM Explorer tab; if not, do so

  • Pick the Events tab on the right-hand side

It lists the event handlers attached to the element, including DOM2 ones.

For instance, using this fiddle:

<div id="target">
I have a DOM2 event handler.
</div>

function thisIsADOM2Handler() {
    this.style.color = "green";
}
document.getElementById("target").addEventListener("click", thisIsADOM2Handler, false);

I followed the steps above to see this:

enter image description here

I need to list the attached event handlers to window unload event

You'll find the handlers for the window unload event listed on the body element, so navigate there in the DOM Inspector to see them:

enter image description here

Comments