Monday, October 1, 2012

JS Console

JS Console is a tool I enjoy for messing around with JavaScript without having to create a bunch of HTML (although you can work with the DOM in JS Console). This is proving very handy as I go through JavaScript books/tutorials and want to try code out quickly.  JS Console allows you to do remote JavaScript debugging as well.


How do I use JS Console?

Type or paste JavaScript into the text bar at the top.  You can also load JavaScript libraries (like JQuery) or DOM.

JS Console remote debugging

I don't do mobile development, but it looks like there's a neat way to use your computer's browser to debug JavaScript on your phone(!) or on another machine/session.  And there's a native iOS app.  I have not experimented with the remote debugging.


What can I access in JS Console?

DOM

Looks like you can get to everything in your browser.  If you type document in the text field, for example, you'll get the HTMLDocument object represented as a String.  


localStorage and sessionStorage

You can also view and manipulate localStorage and sessionStorage if supported by your browser (when I did this in IE7 I got undefined as these aren't supported until IE8).  

I added items to localStorage and remoteStorage, opened another Chrome window and verified that in Chrome and  Firefox separate tabs represent new sessions.  I also learned that JS Console uses sessionStorage to store your history.  And I saw that localStorage is browser-specific.  All Chrome windows and tabs saw what I'd added to localStorage in Chrome even after closing and reopening browsers.  Same thing with Firefox, but Chrome didn't see Firefox's localStorage and vice versa.

No comments:

Post a Comment