Ahmad Farouk
Ahmad Farouk

Reputation: 302

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.

Upvotes: 3

Views: 795

Answers (2)

argonaut36
argonaut36

Reputation: 461

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.

Upvotes: 0

Mrchief
Mrchief

Reputation: 76208

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!

Upvotes: 1

Related Questions