SessionStorage in HTML 5

sessionStorage is an attribute of DOM defined in HTML 5. It is used as a global object in JavaScript or as a sub-object of window, or of an instance of window when several one are opened.


sessionStorage is an  object of type Storage that represents a storage  space defined as an attribute of each window.
It is created for a new visitor and deleted when the user disconnects, or at the request of a script.

It is implemented in browsers since Firefox 3, Internet Explorer 8 and on Chrome, Safari.

There is another object with the  Storage interface , localStorage which is independent of the window and the session is a storage space on the site of the user, to replace cookies.

sessionStorage vs. cookies

It is an alternative to session cookies, but more powerful. The data recorded in the storage are available in all Web pages from the same site and same user during the session.
So it is similar to the session manager of PHP, and it allows for example to register a password to a user to access all services while he stays connected.

In Internet Explorer 8, the space provided to sessionStorage reaches 10 mega bytes when it is 4 KB for each cookie.

Methods of the Storage interface

The methods of the interface Storage in HTML 5 can be used with sessionStorage.

Type Name & arguments Purpose
DOMString key(int)
Returns the name of a key at the index in argument.
DOMString getItem(DOMString)
Returns the value of the key.
void setItem(DOMString, DOMString)
Assigns a value to a key.
void removeItem(DOMString)
Removes the key whose name is in argument.
void clear()
Clear the storage space. All keys are removed.

A key may be created and  a value assigned directly, as in any object. Also you can read the value for a key directly, as shown below.

Testing for compatibility

The support of the object may be checked with this JavaScript code:

if(sessionStorage == null) document.write("Storage not supported by the browser");

And in the current case:

Using the object

You can use sessionStorage directly,  windows being implied. It must be explicit if that designate  another window than the current window.

Values are stored in attributes of the instance of sessionStorage:

sessionStorage.login = "user";


sessionStorage["login"] = "user";

You can access the data stored in the same way:

var login = sessionStorage.login;

These attributes are not predefined, they are key as in ab array that are created dynamically.


A text is entered in this page, and we try to display it in another page.

Type a few words:


© 2009-2012