localStorage和sessionStorage

　　localStorage和sessionStorage是HTML5中用于本地存储的方法。二者的用法几乎相同，不同点是二者的存储时间是不同的：localStorage是一直存储在本地的，而sessionStorage则是当当前窗口关闭的时候，存储的数据就会清空。

　　1.  判断是否支持本地存储

　　判断浏览器是否支持本地存储也是和简单的，只要执行下面的代码就可以了（以localStorage为例）：

if(window.localStorage){
    alert('ok');
}else{
    alert('no');
}

　　

　　2.   localStorage的使用

　　本地存储是通过键值对进行存储的，如下：

var storage = window.localStorage;
storage['name'] = 'local';
console.log(storage['name']);
storage.setItem('name','storage');
console.log(storage.getItem('name'));

　　由此可见对于键值对的存储有两种方式（事实上可以说是三种方式，包括storage.name)：用对象设置获取属性和调用函数的方法。对于存储而言是必须要有清除数据的方法的，在本地存储中，用于清除键值对的方法是removeItem()和clear()，从字面上的意思我们就可以知道：removeItem是用于清除某一个键值对，而clear是用于清除所有的键值对。

var storage = window.localStorage;
storage['name'] = 'local';
storage.removeItem('name');
console.log(storage.name);
storage.setItem('name','storage');
storage.clear(); 
console.log(storage.getItem('name'));

　　如上代码，均显示为undefined，因为每次设置将键值对存入本地后，都会删除键值对。

　　另外本地存储可以使用length来获取键值对的个数。同时HTML5还提供了key(index)函数，可以获得相应的键名，通过key也可以遍历本地存储，将本地存储的键值对都打印出来。

var storage = window.localStorage;
storage.setItem('name','jyy');
storage.setItem('home','chengde');
storage.setItem('age','26');
for(var i = 0; i < storage.length; i++){
    console.log('key:' + storage.key(i) + '---value:' + storage.getItem(storage.key(i)));
}

　　如上面的代码就是将localStorage中的所有键值对进行输入。需要注意的是HTML5的本地存储只能存储字符串类型，因此想要使用其他的类型，需要自己手动转换.

　　另外本地存储还提供了一个storage事件，可以对键值对进行监听。

　　PS.在firefox和chrome中存储和读取都是正常的, 但是对storage事件的触发似乎有点问题, 自身页面进行setItem后没有触发window的storage事件, 但是同时访问A.html和B.html, 在A页面中进行 setItem能触发B页面中window的storage事件, 同样的在B页面中进行setItem能触发A页面中window的storage事件. 在IE9中, 页面自身的设值能触发当前页面的storage事件,同样当前页面的设值能触发同一”起源”下其他页面window的storage事件,这看起来似乎更 让人想的通些.