Window localStorage
Property
Example
Use localStorage to create a locally stored name/value pair with name="lastname" and value="Smith", then retrieve the value of "lastname" and insert it into the element with id="result":
// Store
localStorage.setItem("lastname", "Smith");
// Retrieve
document.getElementById("result").innerHTML = localStorage.getItem("lastname");
Definition and Usage
The localStorage and sessionStorage properties allow the storage of key/value pairs in the browser.
localStorage is used to store data for the entire website permanently. The data does not expire and remains stored until manually deleted.
The localStorage property is read-only.
Tip: If you want to store data for only the current session, use the sessionStorage property. This data object temporarily stores data for the same window (or tab) and is deleted after the window or tab is closed.
Browser Support
The numbers in the table specify the first browser version that fully supports the property.
Property | Chrome | IE | Firefox | Safari | Opera |
---|---|---|---|---|---|
localStorage | 4.0 | 8.0 | 3.5 | 4.0 | 11.5 |
Syntax
window.localStorage
Save data syntax:
localStorage.setItem("key", "value");
Read data syntax:
var lastname = localStorage.getItem("key");
Delete data syntax:
localStorage.removeItem("key");
Technical Details
| Return Value: | A storage object |
More Examples
Example
The following example counts the number of times a button is clicked:
if (localStorage.clickcount) {
localStorage.clickcount = Number(localStorage.clickcount) + 1;
} else {
localStorage.clickcount = 1;
}
document.getElementById("result").innerHTML = "You have clicked the button " +
localStorage.clickcount + " times.";