HTML5：sessionStorage 、 localStorage 、cookie

cookie sessionStorage localStorage 都可以用于本地存储数据，存储格式都是字符串，都使用域名分隔

cookie 

最大长度为4k

发送http请求会自动携带cookie到服务端

超过expire时间后自动销毁

设置 http only 属性后 ，前端无法直接操作该cookie，仅服务端可用

sessionStorage 、localStorage

最大长度视不同浏览器设置而定，通常为5M左右

服务端无法获取

开启浏览器隐身模式（无痕模式）时无法使用，以safari为例，表现为调用localStorage.setItem方法会报错、调用localStorage.getItem方法和localStorage.removeItem方法无效

sessionStorage

当前页面（浏览器tab选项卡）关闭时销毁

不同页面（浏览器tab选项卡）间无法共用

localStorage

始终存在直到手动销毁（JS代码清除，用户清除浏览器缓存，360清理垃圾等）

不同页面（浏览器tab选项卡）间可以公用和通信

使用方法

//写入
localStorage.setItem('a','1') 
localStorage.b = '2'
// 当前localStorage为 {a:'1',b:'2',length:1}

//读取
var a = localStorage.getItem('a') 
console.log(a)  //1
var b = localStorage.b 
console.log(b)  //2
var firstItemKey = localStorage.key(0)  //读取第一条数据的变量名
console.log(firstItemKey)  //'a'

//判断指定变量是否存在
var hasA = localStorage.hasOwnProperty('a') 
console.log(hasA) // true
var hasB = localStorage.hasOwnProperty('b')  
console.log(hasB) // ture
var hasC = localStorage.hasOwnProperty('c')  
console.log(hasC) // false

//删除
localStorage.removeItem('a'); 
// 当前localStorage为 {b:'2',length: 0}

//清除
localStorage.clear() 
// 当前localStorage为 {length: 0}