Chris Manciero.com

Web Storage in HTML5

HTML5 offers a new way to store data instead of having to send and retrieve data from a database or by using cookies.

Local Storage & Session Storage

Local Storage
Local storage give you the ability to store values in the browser so that the next time a user visits the page.

Setting a value is easy. Just add this line of code in your JavaScript function and a value will be set.

// valueName = the storage key
// Myvalue = the storage value for 'valueName'
// set value for localstorage
window.localstorage.setItem('valueName', 'MyValue');

To retrieve a value is just as simple.
// valueName = the storage key
// set value for localstorage
window.localstorage.getItem('valueName');


Session Storage
Session storage works the same way as localstorage, except that the session is stored per browser tab.

Setting a value is easy. Just add this line of code in your JavaScript function and a value will be set.

// valueName = the storage key
// Myvalue = the storage value for 'valueName'
// set value for localstorage
window.sessionstorage.setItem('valueName', 'MyValue');

To retrieve a value is just as simple.
/*
valueName = the storage key
*/
// set value for localstorage
window.sessionstorage.getItem('valueName');