Web Storage 是一种简单的将JavaScript处理的数据永久保存的接口，它可以让我们不通过服务器进行数据的读写，可以很好的减少和服务器的通信，实现离线操作。
特点：
1、以键值对的形式存储
2、能够以普通JavaScript对象的方式进行读写
Web Storage提供了同源服务的共享内存，不同服务，只要源相同，就可以共享存储，大部分浏览器以5MB为上限，Web Storage 实体是全局对象中对已的localStorage和sessionStorage 两个对象，localStorage中保存的数据只要没被显式的删除，就不会丢失，sessionStorage保存数据仅在同一个会话中保留。
基本操作：
1、数据的读写：
可以通过setItem方法将数据存至localStorage中，并通过getItem方法引用数据，也可以通过相应的语法进行读取
//数据保存，以下3行等价
localStorage.setItem('foo','bar');
localStorage.foo='bar';
localStorage['foo']='bar';
//数据的引用，以下3行等价
var data= localStorage.getItem('foo');
var data= localStorage.foo;
var data= localStorage['foo'] localStorage只能对字符串进行读写，若要存储对象，可以使用JSON.stringfy和JSON.parse方法，进行相关转换
2、数据的删除：
可以通过removeItem方法删除，也可以通过相应的语法进行删除。
//删除数据
localStorage.removeItem('foo');
delete localStorage.foo;
delete localStorage['foo']; 若要一次性全部删除，可以使用clear方法。
3、数据的枚举
可以通过key方法和length属性来枚举localStorage中的数据，也可以通过for in语句枚举
//key方法和length枚举
for(var i=0;i<localStorage.length;i++) {
var key =localStorage.key(i),
value=localStorage[key];
}
//通过for in语句枚举
for(var key in localStorage) {
//使用直接属性
if(localStorage.hasOwnProperty(key)) {
var value=localStorage[key];
}
}
Web Storage中的storage事件：
在某一个窗口改变了Web Storage的数据后，就会在其他窗口触发storage事件，通过监听该事件，就能保证多个同时打开窗口间的数据一致性。
window.addEventListener('storage',function(event) {
if(event.key === 'userid'){
var msg = 'Hello '+ event.newValue;
document.getElementById('msg').textContent = msg;
}
},false);
命名空间的管理：
应该避免直接对于localStorage的数据添加，而是对于一个服务，创建该服务对应的命名空间，然后将其绑定到localStorage中
//以服务为单位进行命名空间管理
var SERVICE_NAME ='my service',
mystorage = null;
//通过load事件读取数据到本地变量
window.onload = function() {
try{
mystorage =JSON.parse(localStorage[SERVICE_NAME] || '{}');
}catch(e){
mystorage = {};
}
};
//通过beforeunload事件将数据写入localStorage
window.onbeforeunload = function() {
localStorage[SERVICE_NAME] = JSON.stringfy(storage);
}
此时，对于多个标签页的数据一致性问题，就需要在合适的时间，将本地变量写入localStorage中进行同步，并捕捉storage事件，在其他页执行更新操作，读到本地变量。
//写入localStorage
function setStorage(key,value){
storage[key] = value;
localStorage[SERVICE_NAME] =JSON.stringfy(storage);
}
//其他页内读入本地变量
window.onstorage= function(event) {
if(event.key === SERVICE_NAME && event.newValue){
storage = JSON.parse(event.newValue);
}
}
