This little beauty, once you’ve added the bookmark to your browser allows you to open a JavaScript Shell for any page you happen to be on! The shell lets you enter JavaScript from command-line to manipulate the page, trigger functions, analyze properties, etc. All libraries that the site has loaded are available within the Shell…so, if you use jQuery or some other toolkit, all defined functions and plugins are usable.

Here’s some features and pre-defined functions from the JavaScript Shell site

Features

• You can enter statements and expressions at the same prompt.
• The result of each non-void statement or expression is shown.
• User-defined variables.
  • b = document.body
• User-defined functions.
  • function f() { return 5; }
• JavaScript error messages are shown in red.
• Previous statements and expressions are available through Up and Down arrow keys.
• Tab completion.
• Multiline input (Shift+Enter to insert a line break).
• If the shell is opened using a bookmarklet, JavaScript typed into the shell runs in the context of the original window.
• Works well in Firefox, mostly works in Opera 8 and in IE 6 for Windows.

Built-in functions

• ans: the result of the previous expression.
• print(expr): prints expr on its own line.
  • for(i = 0; i < 6; ++i) print(i * i)
• pr(expr): prints and returns its input, so you can use it to print intermediate results in the middle of an expression.
  • function fact(n) { return n>0 ? pr(n*fact(n-1)) : 1 }
• blink(node) or Alt+B: makes a node blink for a second.
  • blink(document.links[3])
• props(obj) or Alt+P: lists the methods and fields of an object.
  • props(document.body)
  • In Firefox, props also shows which properties belong to the object itself and which belong to objects in its prototype chain.

I’m a fan :D

• JavaScript Debugger
• Stack Traces with JavaScript Errors
• Debug JavaScript Errors
• Logging levels and assertions
• printf-like String formatting

For more info, check out the release notes!

(note: I found out about this on Ajaxian)

The extensibility of the god of browsers is where things really shine for me as a developer…a web application developer. There are two that I use religiously for Javascript debugging, DOM inspecting, CSS tweaking, source viewing, Ajax calls, etc. Here they are. Get them. Use them. You’ll crap your pants.

Web Developer – get it here.

The Web Developer extension adds a menu and a toolbar to the browser with various web developer tools. It is designed for Firefox, Flock, Mozilla and Seamonkey, and will run on any platform that these browsers support including Windows, Mac OS X and Linux.

Firebug – get it here.

FireBug is a new tool that aids with debugging Javascript, DHTML, and Ajax. It is like a combination of the Javascript Console, DOM Inspector, and a command line Javascript interpreter.

Other fun features:

* XMLHttpRequest Spy – Ever wonder what all them newfangled Ajax websites are up to? Watch the requests fly by in the console!

* One web page, one console – Tired of slogging through a zillion errors in the JavaScript Console trying to find the one you want? The FireBug console is built into the bottom of the browser, and only shows you errors and log messages that came from the page you’re looking at.

* JavaScript Error Status Bar Indicator – It’s a sin that Firefox doesn’t include this by default, like IE does. When there is an error in the page, the status bar will let you know with a big red blob.

* Logging for web pages – Sick and tired of “alert debugging”? Jealous of all your C programmer buddies with their fancy printf? Now you can log text and objects to the FireBug console from any web page. See my website for more info on this.

[etc]

And obviously…if you don’t have FireFox (tsk tsk), get it here: