View DOM events (tag "ev") in Firefox Developer Tools, How?

The Firefox inspector can list all event listeners attached to a specific DOM node from Firefox 33.

Page example:

<!doctype html> <body> <button id="Btn">Test</button> <script> function TestEventListener(e){ console.log("handle event"); } var btn = document.querySelector("#Btn"); if(btn){ btn.addEventListener("click",TestEventListener,false); } </script> </body> </html> 

Then press F12 and select "Inspector", press the small ev tag towards <button> . enter image description here

  • How did Firefox do it?
  • Is Firefox modified with addEventListener from the start?
  • Can this be done using native Javascript?

    Like this:

     function GetDOMEventList(node){ var listenerFunctionsList = []; [Magic Moves] return listenerFunctionsList; // [func1, func2, func3...] } 
+5
source share

Source: https://habr.com/ru/post/1267043/


All Articles