AJAX + DOM + BrowJax

I’ve been going through Pragmatic AJAX: A Web 2.0 Primer and got to the debugging section this morning. They mentioned some Firefox plugins and other useful things:

Firefox Plugins

View Source Chart - shows you the page’s structure in colored, nested boxes.

View Formatted Source - color-coded source with CSS properties

MODI

MODI v2.0.2 - A bookmarklet that lets you mouseOver elements to get more info.

DOM and Debug in Safari

To turn on the Debug Menu in Safari, open a Terminal and run:

$ defaults write com.apple.Safari IncludeDebugMenu 1

You’ll now get the Debug Menu and be able to access the DOM Inspector and other goodness.