localStorage
Tutorial: DOM实战
Category: JS
Published: 2026-04-07 13:58:26
Views: 20
Likes: 0
Comments: 0
<!DOCTYPE html>
<html lang="en">
<head></head>
<body>
<input type="text" />
<button class="set">存储数据</button>
<button class="get">获取数据</button>
<button class="remove">删除数据</button>
<button class="del">清空所有数据</button>
<script>
var ipt = document.querySelector("input");
var set = document.querySelector(".set");
var get = document.querySelector(".get");
var remove = document.querySelector(".remove");
var del = document.querySelector(".del");
set.addEventListener("click", function () {
var val = ipt.value;
localStorage.setItem("username", val);
});
get.addEventListener("click", function () {
console.log(localStorage.getItem("username"));
});
remove.addEventListener("click", function () {
localStorage.removeItem("username");
});
del.addEventListener("click", function () {
localStorage.clear();
});
</script>
</body>
</html>