localStoragelocalStorage可以将第一次请求的数据直接存储到本地,解决了cookie存储空间不足的问题(cookie中每条cookie的存储空间为4k),localStorage中一般浏览器支持的是5M大小(不同的浏览器有所不同)。
localStorage的局限
1、浏览器的大小不统一,并且在IE8以上的IE版本才支持localStorage这个属性
2、目前所有的浏览器中都会把localStorage的值类型限定为string类型,这个在对我们日常比较常见的JSON对象类型需要一些转换
3、localStorage在浏览器的隐私模式下面是不可读取的
4、localStorage本质上是对字符串的读取,如果存储内容多的话会消耗内存空间,会导致页面变卡
5、localStorage不能被爬虫抓取到
localStorage与sessionStorage的唯一一点区别就是localStorage属于永久性存储,而sessionStorage属于当会话结束的时候,sessionStorage中的键值对会被清空
localStorage生命周期是永久
sessionStorage生命周期为当前窗口或标签页,一旦窗口或标签页被永久关闭了,那么所有通过sessionStorage存储的数据也就被清空了
//判断浏览器是否支持
if(!window.localStorage){
alert("浏览器不支持localstorage");
return false;
}else{
//主逻辑业务
var storage=window.localStorage;
//写入a字段
storage["a"]=1;
//写入b字段
storage.b=2;
//写入c字段
storage.setItem("c",3);
console.log(typeof storage["a"]);
console.log(typeof storage["b"]);
console.log(typeof storage["c"]);//打印出来的都是string类型
}
官方推荐的是getItemsetItem这两种方法对其进行存取
var storage=window.localStorage;
//增
storage["a"]=1;
storage.b=2;
storage.setItem("c",3);
//删
storage.clear();//删除所有内容
storage.removeItem("a");//删除某个键值对
//改
storage.a=4;
//查
for(var i=0;i<storage.length;i++){
var key=storage.key(i);
console.log(key);
}
JSON存入localStorage中,但是在localStorage会自动将localStorage转换成为字符串形式,可以使用JSON.stringify()这个方法,来将JSON转换成为JSON字符串
var data={
name:'xiecanyong',
sex:'man',
hobby:'program'
};
//将JSON对象转换成为字符串
var d=JSON.stringify(data);
storage.setItem("data",d);
//将字符串转换成为JSON对象
var json=storage.getItem("data");
var jsonObj=JSON.parse(json);