localStorage && sessionStorage
在HTML5中，为了在客户端存储数据，HTML提供了两种在客户端存储数据的新方法：
localStorage:没有时间限制的数据存储。
sessionStorage:针对一个session的数据存储，也就是重新打开页面sessionStorage失效。
在之前，都是用cookie来完成的，但是cookie不适合大量的数据存储，因为他们由每个对服务器的请求来传递，所以速度慢效率也不高。在HTML5中，使用JavaScript来访问和存储数据。
1、localStorage
localStorage存储的数据没有时间限制。只要不被清理会一直存在。下面简单介绍一下相关方法以及使用。
- 域相关
- 永久保存在本地(client)
- 容量无限制
- 数据不会过期，除非由于security 原因活着用户请求删除
①、判断浏览器是否支持localStorage。
我们只需要书写如下代码，然后在浏览器打开网页即可：
<!DOCTYPE html>
<html>
<head>
<title>LocalStorage</title>
<meta charset="utf-8">
</head>
<body>
<script type="text/javascript">
if (window.localStorage) {
alert("浏览器支持localStorage");
}else {
alert("浏览器不支持localStorage");
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>LocalStorage</title>
<meta charset="utf-8">
</head>
<body>
<script type="text/javascript">
if (localStorage.requestcout) {
localStorage.requestcout = Number(localStorage.requestcout)+1;
}else {
localStorage.requestcout = 1;
}
document.write("（这里是刷新就算一次访问页面）本网页的访问量是："+localStorage.requestcout+"次");
</script>
</body>
</html>
存储/访问localStorage
localStorage.setItem("name","zhanggui");
localStorage["name"] = "zhanggui"；
var valure = localStorage.getItem("name");
var valure = localStorage["name"];
清除localStorage
localStorage.removeItem("name"); //根据key值清空某个localStorage
localStorage.clear(); //这里是讲所有的localStorage清空
sessionStorage
跟Local Storage类似，但Session Storage 只与当前会话相关，浏览器关闭则删除。 其特别之处有：
top browser context，及在同一个页面内的所有frame/iframe 共享同一个session storage； 不同的page 有不同的session storage
会话结束即删除
sessionStorage和localStorage的操作差不多。唯一的区别就是localStorage每次打开页面还会存在，而sessionStorage每次打开页面都会初始化。就像刚才统计访问页面次数：
如果用sessionStorage来存储，那么下次打开页面他的访问次数是1，而不是累加上次请求次数。
Local Storage存在的问题
在查询资料的过程中，发现了很多Local Storage的缺陷，有一篇关于Local Storage的论文可以参考。有以下几点：
- 不要用Local Storage来做持久化存储，在iOS中，出现存储空间紧张时，它会被系统清理掉；
- 不要用Local Storage来存大量数据，它的读写效率很低下，因为它需要序列化/反序列化；
- 大小限制为5M。
网友评论