浏览器本地存储 localStorage、sessionStorage

本地存储（localStorage ）

存储

setItem

//键和值都是字符串
localStorage.setItem("stringKey","StringVal");
//即使存数字，也会转字符串
localStorage.setItem("num",666);
//存对象，默认调用objec的toString方法，无意义，可转化为json后再存储
const personObj = {
    
    
    name:"张三",
    age:18
}
localStorage.setItem("personObj",JSON.stringify(personObj));

浏览器本地存储空间：
F12观察

获取

getItem

var val;
val = localStorage.getItem("stringKey");
console.log("stringKey",val);
val = localStorage.getItem("num");
console.log("num",val);
val = localStorage.getItem("personObj");
console.log("personObj",val);
val = localStorage.getItem("不存在的key");
console.log("不存在的key",val);

观察到，如果获取一个不存在的key，结果是null

删除一个

localStorage.removeItem("stringKey");

清空所有

localStorage.clear();

会话存储（sessionStorage ）

调用方法完全和localStorage一样，只用把上述代码中的localStorage换成sessionStorage 。

它在浏览器关闭的时候就会自动清除

总结