localStorage和sessionStorage的相同点和区别

localStorage和sessionStorage：都是用于本地存储，就是保存在浏览器中

---

区别：

localStorage
用于长久保存整个网站的数据，保存的数据没有过期时间，直到手动去删除。也就是说localStorage会将需要保存的数据长期保存在浏览器中，就算关闭了浏览器也还会存在，除非手动删除。

//保存数据
setLocal.onclick = function(){
	// 第一种
	// localStorage.setItem('name','krisW')
	localStorage.setItem('name',$('#inputLocal').val())
	$('#inputLocal').val('')
	
	// 第二种
	// localStorage.name = 'sweet'
}

//将数据在页面显示
getLocal.onclick = function(){
	// 第一种
	$('#pLocal').html(localStorage.getItem('name'))
	
	// 第二种
	// $('#pLocal').html(localStorage.name)
}

//删除数据
clearLocal.onclick = function(){
	localStorage.removeItem('name')
	$('#pLocal').html('')
}

localStorage 的优势：
1、localStorage 拓展了 cookie 的 4K 限制。
2、localStorage会可以将第一次请求的数据直接存储到本地，这个相当于一个 5M 大小的针对于前端页面的数据库，相比于 cookie
可以节约带宽，但是这个却是只有在高版本的浏览器中才支持的。

localStorage 的局限：
1、浏览器的大小不统一，并且在 IE8 以上的 IE 版本才支持 localStorage 这个属性。
2、目前所有的浏览器中都会把localStorage的值类型限定为string类型，这个在对我们日常比较常见的JSON对象类型需要一些转换。
3、localStorage在浏览器的隐私模式下面是不可读取的。
4、localStorage本质上是对字符串的读取，如果存储内容多的话会消耗内存空间，会导致页面变卡。
5、localStorage不能被爬虫抓取到。 localStorage 与 sessionStorage 的唯一一点区别就是 localStorage 属于永久性存储，而 sessionStorage 属于当会话结束的时候，sessionStorage中的键值对会被清空。

---

sessionStorage
将数据保存在当前会话中，在关闭窗口或标签页之后将会删除这些数据。

setSession.onclick = function(){
	// 第一种
	// sessionStorage.name = 'krisW'
	sessionStorage.setItem('name',$('#inputSession').val())
	$('#inputSession').val('')
	
	// 第二种
	// sessionStorage.setItem('name','sweet')
}

getSession.onclick = function(){
	// 第一种
	$('#pSession').html(sessionStorage.name)
	
	// 第二种
	// $('#pSession').html(sessionStorage.getItem('name'))
}

clearSession.onclick = function(){
	sessionStorage.removeItem('name')
	$('#pSession').html('')
}