Firefox - Mozila - Web document debugging tricks

Web Document Debugging Tricks

Firefox has a potpourri of small tricks you can use to debug your web page.

This hack describes some small features and tricks that can ease the page creation process. It's all bits and pieces here. For more systematic techniques, try web page validation, the DOM Inspector , or the JavaScript Debugger just for starters.

Portable Debugging Tricks

These old saws have been supported by most web browsers for a long time. Here they are again, for completeness. First, some common tripping points:

• JavaScript variables are declared differently in PHP, Perl, and JSP. Use var in JavaScript, nothing in PHP, my in Perl, and int or another type in JSP. Don't punctuate JavaScript variable names unless they deserve a leading underscore.

• It's document.forms, not window.forms.

Use alert( )

From any JavaScript scriptexcept for proxy, ReadConfig, AutoConfig, and preference filesthe mighty alert() spits out a string of text in a small window, just as MessageBox does under Win32 for Visual Basic and related languages. It also suspends all script processing. alert() is a property of the window DOM 0 object in both HTML and XUL scripts. Here's that trivial tool at work:

var result = 5;
alert("Result times 100: " + (result *100)); 
// or use window.alert(  )

Probe page contents with javascript: URLsThe javascript: URL scheme allows a line of code to run interactively. That can also be done in the JavaScript Console (in Firefox), but there the currently displayed page is not in context. For a contextual example, try loading the page:
http://www.altavista.com.

Then, type this in the Location bar:

javascript:document.forms[0].elements[0].tagName

This should be the response (an HTML <input> tag):INPUT

To report on a web page's content without destroying the display of the page, do this:

javascript:alert(document.forms[0].elements[0].tagName)

To perform more complex calculations, just ensure that the last statement executed returns void. This example sets the web page script variable total:

javascript: var len = document.forms.length;
 window.total = len; void;