Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Posted by Abe Layee
Abe Layee
8,378 Points

Tools for inspecting JavaScript code.

Hello all. How are we all doing today? I have a question. Is there a plugin that shows you all the JavaScript for each element on a website. I mean like Google chrome developer tool shows all the css styles that are applied to an element on website. I know about Firebug. Thank you and stay bless:D

3 Answers

Neil Docherty
Neil Docherty
10,418 Points
Neil Docherty
Neil Docherty
10,418 Points

You can use the Chrome Developer Tools to view the Event Listeners.

For simplicity... take a look at this Codepen.

Right-click on the "Click Here" button to Inspect Element. Then, in the Elements section of the Developer Tools you will see the 'Event Listeners' tab. Selecting this you will see that only the 'click' is listed. Exploring this will give you a link to the code that deals with that event.

Hope this provides some help.

Jonathan Etienne
Jonathan Etienne
24,572 Points
Jonathan Etienne
Jonathan Etienne
24,572 Points

Hi Abraham,

There's quite a few handy tool with the already tools you have. In Google's chrome developer tool you have console if you click on "sources" than you have access to all of the JavaScript pertaining to each source, and its quite organized pretty well.

If you are doing the coding, and like the sublime text editor, you might want to look into -https://github.com/sokolovstas/SublimeWebInspector

If you are just surfing the web and need something more advanced than the default, you can look into this extension. https://chrome.google.com/webstore/detail/js-runtime-inspector/iilpjebedgohcmlffhnkhbjhabkdhfmn

Abe Layee
Abe Layee
8,378 Points
Abe Layee
Abe Layee
8,378 Points

Thank you all.