浅析 localStorage和sessionStorage

localStorage和sessionStorage 都是H5的新特性,是Web Storage的一种存储方式,都是用来存储客户端临时信息的对象。

这两者区别在于localStorage用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的。

而sessionStorage存储的数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储,仅仅是会话级别的存储。

简单理解就是当你打开一个浏览器的页面时记录 sessionStorage,当你把页面或者浏览器关闭时sessionStorage中的数据即销毁
 

API:

localStorage:

window.localStorage.setItem(key, value); //设置值
window.localStorage.getItem(key); // 获取值
window.localStorage.removeItem(key); // 删除某个值
window.localStorage.clear(); //清空所有存储

sessionStorage:

window.sessionStorage.getItem(key);
window.sessionStorage.setItem(key, value);
window.sessionStorage.removeItem(key);
window.sessionStorage.clear();

实战:

var obj = {"name":"xiaoming","age":"16"};
window.localStorage.setItem('userInfo', JSON.stringify(obj));
var userInfo = window.localStorage.getItem('userInfo');
console.log(userInfo); // {"name":"xiaoming","age":"16"}

可以看到在本地localStorage中key:userInfo, value:{"name":"xiaoming","age":"16"} 已经存储了

当执行:window.localStorage.removeItem('userInfo') 后,再查看发现key,value都已经被删除了

其他API这里就不再演示了。

发布了69 篇原创文章 · 获赞 35 · 访问量 7万+

猜你喜欢

转载自blog.csdn.net/qyl_0316/article/details/104143338