This page is Ready to Use

Notice: The WebPlatform project, supported by various stewards between 2012 and 2015, has been discontinued. This site is now available on github.



Provides a Storage object for an origin, that remains persistent even after restarting the browser. The storage can be cleared by the user with browser functionalities. If you need a temporary storage, use apis/web-storage/Storage/sessionStorage

Property of apis/web-storage/Storageapis/web-storage/Storage


Note: This property is read-only.

var result = object.localStorage;

Return Value

Returns an object of type ObjectObject


if (window.localStorage) { // checks if browser support localStorage
  if (localStorage['testKey']) { // checks if value exists
    console.log('Value exist on page load in localstorage for key testKey : ', localStorage['testKey']);
  localStorage['testKey'] = 'Hi again!'; // stores value in localstorage
else {
 console.log('your browser dont support localstorage');

Fields and buttons for saving, reading and clearing localStorage items.

    <label for="key">Key:</label>
    <input type="text" id="key" value="r2d2">
    <label for="value">Value:</label>
    <input type="text" id="value" value="C-3PO">
    <button type="button" id="set-local">Save to localStorage</button>
    <label for="get-key">Key:</label>
    <input type="text" id="get-key" value="r2d2">
    <button type="button" id="get-local">Get from localStorage</button>
    <output id="output"></output>
    <button type="button" id="clear">Clear localStorage</button>

View live example

Functions and event handlers for saving, reading and clearing localStorage items.

/* global document, window */
var valueSetHandler = function () {
    /** read the values from the form */
    var key = document.getElementById('key').value,
        value = document.getElementById('value').value;

    /** save value under key in localStorage */
    window.localStorage.setItem(key, value);
valueGetHandler = function () {
    /** read the value from the form */
    var key = document.getElementById('get-key').value,

        /** read the value from the localStorage */
        value = window.localStorage.getItem(key);

    /** write the value in output */
    document.getElementById('output').innerText = value;
clearStorageHandler = function () {

/** register event Listeners for button clicks */
document.getElementById('set-local').addEventListener('click', valueSetHandler);
document.getElementById('get-local').addEventListener('click', valueGetHandler);
document.getElementById('clear').addEventListener('click', clearStorageHandler);


 Use via the methods setItem, getItem, removeItem and clear provided by apis/web-storage/Storage.

Listen to the storage event on dom/Window to catch changes in the storage (example:


The localStorage “property” provides an instance of a storage area object, to which the Storage object’s properties and methods are applied.

The amount of storage is limited by the browser on a per location basis (e.g. per domain). An error message is thrown, when the quota is exceed.

See for an example of the error message here (the example shows the error message for when the sessionStorage quota is exceeded. The behavior is similar for localStorage):

Related specifications

W3C Web Storage Specification
W3C Recommendation

See also

Related articles

Off-line Storage