526互联

BOM-本地存储和会话存储

发布时间 2023-04-20 09:33:10作者: 挖洞404

1、介绍

本地存储和会话存储，分别指window.localStorage和window.sessionStorage。

两者具有基本相同的语法，都可以存储数据到浏览器中，区别在于localStorage是永久存储，而sessionStorage是会话存储。

2、语法

storage表示window.localStorage和window.sessionStorage。

（1）写入或保存

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

（2）删除

storage.removeItem("key");
storage.clear();

3、特性

（1）localStorage

  • localStorage 会可以将第一次请求的数据直接存储到本地，这个相当于一个 5M 大小的针对于前端页面的数据库，相比于 cookie 可以节约带宽，但是这个却是只有在高版本的浏览器中才支持的。
  • 浏览器的大小不统一，并且在 IE8 以上的 IE 版本才支持 localStorage 这个属性。
  • 目前所有的浏览器中都会把localStorage的值类型限定为string类型，这个在对我们日常比较常见的JSON对象类型需要一些转换。
  • localStorage在浏览器的隐私模式下面是不可读取的。
  • localStorage 的使用也是遵循同源策略的，所以不同的网站直接是不能共用相同的 localStorage

（2）sessionStorage

  • 用于临时保存同一窗口(或标签页)的数据，在关闭窗口或标签页之后将会删除这些数据。