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事件,这看起来彷佛更 让人想的通些.