JavaScript Shell

While at The Ajax Experience I noticed a tool that a few of the speakers made use of that was missing from my arsenal. The tool? JavaScript Shell.

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