Tutorial by Examples

The localStorage object provides persistent (but not permanent - see limits below) key-value storage of strings. Any changes are immediately visible in all other windows/frames from the same origin. The stored values persistent indefinitely unless the user clears saved data or configures an expirati...

Whenever a value in set in localStorage, a storage event will be dispatched on all other windows from the same origin. This can be used to synchronize state between different pages without reloading or communicating with a server. For example, we can reflect the value of an input element as paragrap...

The sessionStorage object implements the same Storage interface as localStorage. However, instead of being shared with all pages from the same origin, sessionStorage data is stored separately for every window/tab. Stored data persists between pages in that window/tab for as long as it's open, but is...

To clear the storage, simply run localStorage.clear();

Most browsers, when configured to block cookies, will also block localStorage. Attempts to use it will result in an exception. Do not forget to manage these cases. var video = document.querySelector('video') try { video.volume = localStorage.getItem('volume') } catch (error) { alert('If...

To remove a specific item from the browser Storage (the opposite of setItem) use removeItem localStorage.removeItem("greet"); Example: localStorage.setItem("greet", "hi"); localStorage.removeItem("greet"); console.log( localStorage.getItem("greet...

localStorage, sessionStorage are JavaScript Objects and you can treat them as such. Instead of using Storage Methods like .getItem(), .setItem(), etc… here's a simpler alternative: // Set localStorage.greet = "Hi!"; // Same as: window.localStorage.setItem("greet", "Hi!&qu...

localStorage.length property returns an integer number indicating the number of elements in the localStorage Example: Set Items localStorage.setItem('StackOverflow', 'Documentation'); localStorage.setItem('font', 'Helvetica'); localStorage.setItem('image', 'sprite.svg'); Get length localSto...