Section A.3. 3: Inspecting the DOM

A.3. #3: Inspecting the DOM

By now, you're a pro at using the Document Object Model to update your web pages on the fly. But once you've used the DOM to make changes to your page, how can you see exactly what the web browser sees? The answer is to use a DOM inspector:

This is the Top 5 CDs app from Chapter 4.5, running on the Firefox web browser.

Open the DOM Inspector on Firefox by going to the Tools menu, and selecting DOM Inspector.

You can see details about each node in this part of the DOM inspector.

You can expand the DOM tree, and click on a node to get details about that particular node in the DOM tree.

NOTE: You need to specifically request that the DOM inspector be installed on Windows. When you're installing Firefox, select Custom Install, and then Web Developer Tools. This will ensure the DOM inspector is installed with your version of Firefox.