demo.html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<input type="text">
<button>设置</button>
<button>获取</button>
<button>删除</button>
<button>清除全部</button>
<script>
// H5中两种web存储方式
// sessionStorage 5M 浏览器关闭后失效(内存)
// localStorage 20M 永久生效,除非手动删除(硬盘)
var txt = document.querySelector("input");
var btns = document.querySelectorAll("button");
// 设置/更新存储
btns[0].onclick = function() {
window.sessionStorage.setItem("userName",txt.value); // 设置/更新sessionStorage
}
// 获取
btns[1].onclick = function() {
var str = window.sessionStorage.getItem("userName"); // 获取sessionStorage ，没有时获取到null
console.log(str);
}
// 删除
btns[2].onclick = function() {
window.sessionStorage.removeItem("userName"); // 删除指定sessionStorage
}
// 清空所有
btns[3].onclick = function() {
window.sessionStorage.clear(); // 清空所有sessionStorage
}
</script>
</body>
</html><!DOCTYPE html>
<html lang="en"
