3

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.

Improve this question

2 Answers 2

Reset to default
1

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!

Improve this answer
Sign up to request clarification or add additional context in comments.

9 Comments

EventBug is not compatible with firefox 4 and higher. solution didn't work out.
Their latest is compatible with FF5: getfirebug.com/releases/eventbug/1.5/eventbug-0.1b9.xpi. In fact, if you look into it, its marked compatible till FF 7.1!
thats what i see in the events tab => click { return typeo... arguments) : b; } function (a) { return typeof f != "undefined" && (!a || f.event.triggered !== a.type) ? f.event.handle.apply(k.elem, arguments) : b; }.. I found the event, but still I don't know how to relate it to the js file
Its hard to tell, but taking a guess, it looks like a jQuery or some other library's click handler. Search for that and put a breakpoint there. Once you hit it, you can look at the Call Stack (in Script Panel) to see where it originated from.
Search for that and put a breakpoint there <= how to search it? have tried several ways, but none works.. how to search it?.. its a jQuery click handler by the way.
|
0

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.

Improve this answer

1 Comment

I need to know what is the script first before I inspect it :)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.