本地存储的特性：

1. 数据存储在用户浏览器中
2. 设置、读取方便、甚至页面刷新不会丢失数据
3. 容量较大，sessionStorage约5M、localStorage约20M
4. 只能存储字符串，可以将对象JSON.stringify()编码后再存储

window.sessionStorage的特性：

1. 生命周期为关闭浏览器时失效
2. 在同一个窗口（页面）下数据可以分享
3. 以键值对的形式存储使用（比如：name=tom，键就是name，值就是tom）
   window.sessionStorage使用方法：
   存储数据：
   sessionStorage.setItem(key,value);
   获取数据：
   sessionStorage.getItem(key);
   删除数据：
   sessionStorage.removeItem(key);
   删除所有数据：
   sessionStorage.clear();

<input type="text">
<button class="set">存储数据</button>
<button class="get">获取数据</button>
<button class="remove">删除数据</button>
<button class="clear">清除所有数据</button>
<script>
var inp = document.querySelector("input");
var set = document.querySelector(".set");
var get = document.querySelector(".get");
var remove = document.querySelector(".remove");
// 点击存储数据按钮，将input的value值存储到浏览器中
set.addEventListener("click",function(){
	var val = inp.value; // 将input的值保存起来
	// 存储数据 sessionStorage.setItem(key,value);
	// key是起的一个名字，要加双引号，value是要存储的值
	sessionStorage.setItem("uname",val);
})

// 点击获取数据按钮，获取到uname值
get.addEventListener("click",function(){
	var val = inp.value;
	// 获取数据 sessionStorage.getItem(key);
	console.log(sessionStorage.getItem("uname"));
})

// 点击删除数据按钮，删除uname值
remove.addEventListener("click",function(){
	var val = inp.value;
	// 删除数据 sessionStorage.removeItem(key);
	sessionStorage.removeItem("uname");
})

// 点击删除所有数据按钮，会删除所有的数据，实际开发中要慎用
clear.addEventListener("click",function(){
	var val = inp.value;
	// 删除所有数据  sessionStorage.clear();
	sessionStorage.clear();
})
</script>