HTML Web Storage

What is Web Storage?

Web Storage stores data in browser (localStorage / sessionStorage).

Example

<h3>Local Storage Example</h3>

<input id="name" placeholder="Enter name">
<button onclick="saveData()">Save</button>
<button onclick="getData()">Get</button>
<button onclick="clearData()">Clear</button>

<p id="result"></p>

<script>

function saveData(){
    let name = document.getElementById("name").value;
    localStorage.setItem("username", name);
    document.getElementById("result").innerHTML = "Saved!";
}

function getData(){
    let name = localStorage.getItem("username");
    document.getElementById("result").innerHTML = name;
}

function clearData(){
    localStorage.removeItem("username");
    document.getElementById("result").innerHTML = "Cleared!";
}

</script>
Try it Yourself

Live Demo

localStorage

Stores data permanently

sessionStorage

Stores data temporarily

removeItem

Deletes stored data

Summary