cookie，sessionStorage，localStorage本地存储

文本本地化存储有很多形式，最近用了几种，分享一下使用方法吧！

---

cookie

cookie现在浏览器都支持，但是原生js使用起来有点复杂，这里推介使用jquery.cookie.js。

注意：
1. jquery.cookie.js 是一款轻量级的 cookie 插件，可以读取，写入和删除 cookie。
2. jquery.cookie.js需要jquery支持，需要在jQuery后面移入它。

这里我就不说怎么引入它们了。

---

使用方法：
1.设置 cookie：

//设置一个键为key的cookie，它的值为value，支持中英文

$.cookie('key', 'value'); //这个在浏览器关闭时被清除

2.设置 cookie的有效期：

//{expires: 5}设置cookie的有效期为5天

$.cookie('key', 'value', {expires: 5}); //这个在5天后被清除

3.设置有效路径（path）、有效域（domain）、及安全性（secure）。
（1）有效路径（path）：指读取cookie的路径，其他路径就算有也不能读取；
（2）有效域（domain）：指只在特定的域名读取cookie；
（3）安全性（secure）：当其值为true时只有https才传递到服务器端，http不会传递。
以上的三个属性一般不用。

4.读取cookie：使用键（key）即可访问它的值

//访问键为key对应的值

$.cookie('key');

//注意：如果你访问的key不存在的话会返回 undefined ，如果没有值得话为null。

5.删除cookie：只要把对应key的值设置为null就可以了

//删除key对应的值

$.cookie('key', null);

举个栗子：在线预览（注意：打开连接会覆盖当前页面！）

---

sessionStorage，localStorage

sessionStorage，localStorage是html5中的Web Storage，只有支持html5的浏览器才能使用；
判断浏览器是否支持，只需要：

//判断浏览器是否支持sessionStorage，localStorage

localStorage和sessionStorage都具有相同的操作方法，他们的区别是：

（1）localStorage：是永久存储，除非你手动删除；

（2）sessionStorage：是会话存储，浏览器关闭时删除，也可以手动删除。

---

使用方法：
1. setItem( key, value) 方法设置item,和cookie一样使用键-值对来存储。

//存储一个值value，它的键为key

sessionStorage.setItem('key','value'); //sessionStorage方法
localStorage.setItem('key','value'); //localStorage方法

2.getItem(key) 方法根据键来读取对应的值

//读取键为 key 的值

sessionStorage.getItem('key'); //sessionStorage方法
localStorage.getItem('key'); //localStorage方法

3.removeItem(key) 方法根据键来删除对应的值

//删除键为 key 的值

sessionStorage.removeItem('key'); //sessionStorage方法
localStorage.removeItem('key'); //localStorage方法

4.clear() 清除所有的值

//清除所有存储的值

sessionStorage.clear(); //sessionStorage方法
localStorage.clear(); //localStorage方法

举个栗子：在线预览（注意：打开连接会覆盖当前页面！）