Warning: Undefined variable $name in /home/yzdpqctr/vinsoft/courses/javascript.php on line 247

Warning: Undefined variable $age in /home/yzdpqctr/vinsoft/courses/javascript.php on line 247
Local Storage | Vinsoft Lab
VL
Vinsoft Lab
Learn • Build • Innovate
Free Web Development Beginner

JavaScript Programming

Learn JavaScript from the beginning and discover how to make websites interactive, dynamic and responsive to user actions.

24 Lessons
6 Weeks
Beginner Friendly
Course progress 0%

Complete lessons as you learn. Your progress is saved automatically in this browser.

Lesson 22 Interactive HTML + JavaScript

Local Storage

Store simple information in the browser using localStorage.

What you should understand

Read the lesson carefully, study the example, then use the editor below to experiment with the code yourself.

Example Code
HTML + JavaScript example
<!DOCTYPE html>
<html>
<body>

<button onclick="saveName()">Save Name</button>
<button onclick="readName()">Read Name</button>

<p id="output"></p>

<script>
function saveName() {
    localStorage.setItem("studentName", "Alex");

    document.getElementById("output").textContent =
        "Name saved!";
}

function readName() {
    let name = localStorage.getItem("studentName");

    document.getElementById("output").textContent =
        name || "No name found";
}
</script>

</body>
</html>

Output

See what your code produces.

Click "Run Example" to execute the example.
Quick Check

Test your understanding

Choose the best answer.

Which method can select an element by its ID?

KEEP BUILDING

Turn what you learn into real projects.

Continue learning through Vinsoft Lab and develop practical skills in web development, programming and software development.