HTML5中的本地存储

WebStorage是HTML5新增的特性，用于本地存储。WebStorage的出现，是为了解决早期使用Cookie进行本地存储的以下不足：
1）Cookie大小有限制，一般不超过4KB，而WebStorage可以进行大容量的存储
2）Cookie包含在每个HTTP请求中，会导致多次发送重复数据给服务器
3）Cookie在网络传输时未经加密（使用SSL除外），存在安全隐患

一、Storage接口

sessionStorage 和 localStorage 都实现了 Storage 接口。Storage接口具有以下的属性和方法：
1）length 返回改Storage中存储的key-value对数
2）key(index) 返回第index个key
3）getItem(key) 获得键名为key的键值对的值
4）setItem(key, value) 设置键值对key=value
5）removeItem(key) 移除键名为key的键值对
6）clear() 清除所有的键值对

二、localStorage和sessionStorage

这两个本地存储方式，均含有一样的方法和属性。区别在于：sessionStorage的生命周期取决于用户的会话，当用户会话结束后（如关闭浏览器、离开页面），sessionStorage便会被清除；而localStorage则会长时间存储，直到用户显示清除；访问方法：

• window.localStorage/localStorage
• window.sessionStorage/sessionStorage

三、遍历

使用for结合localStorage.length来遍历便可，如：

for(let i=0; i<localStorage.length; ++i) {
    var key = localStorage.key(i);
    console.log(key + "=" + localStorage.getItem(key));
}