Using Firebug

Firebug is a firefox-specific extension that helps greatly with web debugging. One of the most useful features is the console and its functions. With Firebug installed, you can use sprintf() style syntax to debug objects and more.

http://www.joehewitt.com/software/firebug/

The below code, placed anywhere within your javascript, will prevent other browsers you test in (IE, for example) from complaining about the global console object not existing:

dbg_console = {
	'log': function() { this.actual_log.apply(this, arguments); },
	'info': function() { this.actual_log.apply(this, arguments); },
	'debug': function() { this.actual_log.apply(this, arguments); },
	'warn': function() { this.actual_log.apply(this, arguments); },
	'error': function() { this.actual_log.apply(this, arguments); },
	'actual_log': function() {
		var x = arguments[0];
		for(var i=1; i<arguments.length; i++) {
			x = x + ', ' + arguments[i];
		}
		window.status = x;
	}
};
if (typeof console != "undefined") { // safari, firebug
    if (typeof console.debug != "undefined") { // firebug
    } else {
		console = dbg_console;
	}
} else {
	console = dbg_console;
}

Sprintf Syntax for Firebug

%o - Formats the object as a hyperlink to the inspector.
%s - Formats the object as a string.
%d, %i, %l, %f - Formats the object as a number.
%x - Formats the object as an interactive XML markup tree.
\% - Percent sign

Why use Firebug?

• Test XPath selectors right from the console
• Border everything to see where object boundries lie: $('*').css({border: '1px solid red'});
• Quick and convenient logging abilities