local Storage使用

有凯泽
2023-12-01

基本概念

Web Storage 中包含如下两种机制:

  • sessionStorage 为每一个给定的源(given origin)维持一个独立的存储区域,该存储区域在页面会话期间可用(即只要浏览器处于打开状态,包括页面重新加载和恢复)。
  • localStorage 同样的功能,但是在浏览器关闭,然后重新打开后数据仍然存在。

这两种机制是通过 Window.sessionStorage 和 Window.localStorage 属性使用(更确切的说,在支持的浏览器中 Window 对象实现了 WindowLocalStorage 和 WindowSessionStorage 对象并挂在其 localStorage 和 sessionStorage 属性下)—— 调用其中任一对象会创建 Storage 对象,通过 Storage 对象,可以设置、获取和移除数据项。对于每个源(origin)sessionStorage 和 localStorage 使用不同的 Storage 对象——独立运行和控制。

基本使用

常用的方法如下

localStorage.length(); // 获取键值对数量

localStorage.key(0); // 获取第1位的值

localStorage.setItem('key1','value1'); // 设置值
localStorage.getItem('key1');   // 获取值

localStorage.removeItem('key1');//按照键名删除某个特定的键值对。

localStorage.clear();  //简单地清空域名对应的整个存储对象

查看方法:
例如在Chrome中,按下F12,选中Application,就可以看到Local Storage与Session Storage。

备注

localStorage的基本单位是网站,也就是说一个域名一个localStorage。在一个网站修改的localStorage在另一个网站是不会生效的。
如果想要删除一个网站的localStorage,一方面可以通过JavaScript控制,另一方面可以通过浏览器的“清除浏览数据”功能。

参考资料:mozilla的locaStorage介绍

 类似资料: