localStorage/sessionStorage

html5提供了两种在客户端存储数据的新方法

    localStorage: 无时间限制的数据存储

    sessionStorage:针对一个session的数据存储

    localStorage/sessionStorage用来替代cookie。因为cookie不能存储大量的数据,二期每个服务器请求都会传递,效率较低速度也慢。

    cookie上限为4k,localStorage一般浏览器支持的是5M大小,这个在不同的浏览器中localStorage会有所不同。

    localStorage支持增删改查。

    localStorage使用:        //sessionStorage使用方式相同

//推荐使用getUtem/setItem,也可以用json方式访问
var storage = window.localStorage;
storage.setItem('name','张三');   //storage.name = '张三'
storage.setItem('code','00001');
console.log(storage.getItem('name'));  //张三
storage.setItem('data',JSON.stringify({phone:'13000000000',car:'红旗'}))

var data = JSON.parse(storage.getItem('data'));
console.log(data.phone+'|'+data.car);//13000000000|红旗
//遍历
console.log(storage.length); //3
for(let i=0;i<storage.length;i++){
    console.log(storage.key(i));    //code data name
}
//删除 
storage.removeItem('code');
for(let i=0;i<storage.length;i++){
    console.log(storage.key(i));    //data name
}

localStorage只存储字符串,如果存储对象,需要用JSON.stringify()将对象反序列化为字符串,同理,获取对象字符串后,序列化为对象。

另外需要注意:

    IE8以上才支持localStorage。

    localStorage在隐私模式下不可读取。

    localStorage不会被爬虫抓取。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章