How to know which JS script manipulated certain elements of the DOM using Firebug

I am inspecting a website, which has tons of JS files loaded from several servers along with jQuery. Number of js files is really big. Some are within the regular scripts tags. Others are loaded dynamically via ajax.

I am interested in certain elements of the DOM which are manipulated because of some js file. I see the dynamic loaded elements in开发者_运维百科 firebug. I needed to know exactly which JS script creates/updates them. I searched the js files for the classes and the IDs of the elements,so I can have some clue about which js file affects them, but I found nothing.

Is there any direct way using Firebug to know exactly which JS file manipulates certain DOM elements?

Thanks in advance.

Not in a direct way.

• Use EventBug addon
• Then search by the function signature in your script panel to drill down to the js file

Hope this helps!

You should be able to go to Script tab in firebug, then look at the toolbar right below the script tab you can select all the javascript files included on the page.

If you have an idea which file it is coming from then select that file and then look through the code and set break points on functions you think the event is coming from by clicking on the respective line number, then refresh the page and perform the event that calls the javascript.

You might have to put in a few before you narrow it down, but the break points will make it alot easier to tell which functions are being called for which events.