localStorage.setItem( key , value ); // saves a new name/value pair if the key doesn't exist, otherwise // updates the value localStorage.getItem( key ); // returns the value associated with the given key, if it exists // returns null if the key doesn't exist localStorage.length; // the number of unique keys stored localStorage.removeItem( key ); // deletes the name/value pair with the given key, if it exists // if it does not exist, exits localStorage.clear(); // delete all name/value pairs currently stored localStorage.key( n ); // returns the name of the nth key in the list, will return null if n is // greater than or equal to localStorage.length
If the localStorage object is available, the setup script exits and allows the method to work normally. Otherwise, it will use the same interface to create a string of name/value pairs to store in cookies. You can use all the methods described above, but it does not support direct access to data, such as ‘localStorage.name = “bob” ;’. One issue is that the older browsers with slow performance will experience another setback when storing large amounts of data, because the cookies will be included in headers.
There are two types of storage methods in the new Web Storage Specification: localStorage and sessionStorage. The sessionStorage data will only persist for the life of the browser window, whereas localStorage will last indefinitely, depending on the browser. This script uses the localStorage, but can be switched to sessionStorage pretty easily. There are a few resources out there already where you can learn a little bit more. Currently, the specification is supported by IE8, Firefox3.5, Safari4, and Chrome (localStorage only).
(Note: I’ve done some brief testing on most browsers, but if you run into a problem, let me know)