HTML5 Web Storage

HTML5 offers two new methods for storing data on the client:

  • localStorage - stores data with no time limit
  • sessionStorage - stores data for one session

HTML5 Web Storage Methods

  • setItem(key,value): adds a key/value pair to the sessionStorage object.
  • getItem(key): retrieves the value for a given key.
  • clear(): removes all key/value pairs for the sessionStorage object.
  • removeItem(key): removes a key/value pair from the sessionStorage object.
  • key(n):retrieves the value for key[n].
sessionStorage.someKey = 'someValue';
sessionStorage.getItem('someKey'); /*returns 'someValue'*/
sessionStorage.someKey; /*returns 'someValue'*/
sessionStorage.removeItem('someKey'); /*Removing a Key/Value*/
sessionStorage.clear(); /*Clearing Storage*/


window.addEvent('domready', function() {	
    var value = sessionStorage.getItem('key');
    alert('No value found');
    else{alert('Value found: ' +value);}
    $$('.button').addEvents({'click': function(e){ 
    alert('remove value');
    }}); });

<p class='button'>remove value</p>

Related Posts

HTML5 geolocation, HTML5 video, HTML5 structure page