Js中localStorage

Posted 2020-10-15 413Xiaol

优点：

　　1.拓展了cookie的4K限制

　　2.将数据直接存储到本地，相当于一个5M的前端页面数据库

不足：

　　1.浏览器的大小不统一

　　2.IE8以上的IE版本才支持

　　3.localStorage的值类型限定为string类型

　　4.localStorage在浏览器的隐私模式下面是不可读取的

　　5.localStorage本质上是对字符串的读取，如果存储内容多的话会消耗内存空间，会导致页面变卡

　　6.localStorage不能被爬虫抓取到

用法：

　　判断是不是支持：

if(!window.localStorage){
    alert("浏览器支持localstorage");
    return false;
}else{
    //主逻辑业务
}

　　存取：

var storage=window.localStorage;
//写入a字段
storage["a"]=1;
 //写入b字段
storage.a=1;
//写入c字段
storage.setItem("c",3);

//第一种方法读取
var a=storage.a;
console.log(a);
//第二种方法读取
var b=storage["b"];
console.log(b);
//第三种方法读取
var c=storage.getItem("c");
console.log(c);

　　删除：

var storage=window.localStorage;
storage.a=1;
storage.removeItem("a");
console.log(storage.a);

　　清空：

var storage=window.localStorage;
storage.a=1;
storage.clear();
console.log(storage.a);

 

 

 

备注：localStorage与sessionStorage的唯一一点区别就是localStorage属于永久性存储，而sessionStorage属于当会话结束的时候，sessionStorage中的键值对会被清空