Look where is js code set events for html document
I have html document and many many js script files. How can i under开发者_运维百科stand where js code set onclick event for element? There are thousands lines of code and look it all is very painfull.
Here is a simple solution:
- Into Google Chrome, go to the Developer Tools ;
Menu
>Tools
>Developer Tools
- Windows shortcut:
Maj
+CTRL
+i
- Mac OS X shortcut:
Command
+Option
+i
- Then, in the "
Elements
" section, found the element you are interested in ; - After this, on the right; you have a lot of information, like styles, metrics, etc. But if you scroll down, at the bottom, you have a section named "
Event Listeners
"
It references all the events and where they are declared.
You can also direcly access this pannel by right clicking on the element of the page, and choose "Inspect Element
"
I have no ready-to-use solution but this might get you started: There is a jQuery plugin to intercept "DOM Mutation Events" (which include "when an attribute is modified".
Here are the docs and here is to the code.
If you're not using jQuery, either convert part of your code to jQuery or analyze the code of the plugin to see how it uses these events.
Related questions: firing event on DOM attribute change
精彩评论