18910140161

WEB Storage的实现原理详解

顺晟科技

2021-06-16 11:04:14

185

网络存储功能是在网络上存储数据,分为两种类型:

会话存储:将数据保存在会话对象中。所谓会话,是指用户从进入网站到关闭浏览器浏览网站的时间。会话对象可用于保存在此期间需要保存的任何数据

LocalStorage:数据保存在客户端的本地硬件设备中。即使关闭浏览器,数据仍然存在,并且在下次打开浏览器访问网站时仍然可用

区别:会话存储是临时存储,本地存储是存储

HTML5中提供了localStorage对象,可以将数据长时间保存在客户端,直到手动清除。LocalStorage提供几种方法:

1.存储:localStorage.setItem(键,值)

如果键存在,则更新值

2.Get: localStorage.getItem(键)

如果键不存在,则返回null

3.删除:localStorage.removeItem(键)

一旦删除,所有与键对应的数据都将被删除

HTML5中提供了localStorage对象,可以将数据长时间保存在客户端,直到手动清除。LocalStorage提供几种方法:

1.存储:localStorage.setItem(键,值)

如果键存在,则更新值

2.Get: localStorage.getItem(键)

如果键不存在,则返回null

3.删除:localStorage.removeItem(键)

一旦删除,所有与键对应的数据都将被删除

4.全部清除:localStorage.clear()

有时候用removeItem逐个删除太麻烦,可以用clear,执行的结果会是清除所有localStorage对象保存的数据

5.遍历本地存储中存储的密钥。数据总量,例如:localStorage.length。key(index)获取密钥,例如:var key=local storage . key(index);

6.存储JSON格式的数据

JSON.stringify(数据)将对象转换为JSON格式的数据字符串,并返回转换后的字符串

JSON.parse(数据)将数据解析成对象,并返回解析后的对象

以下是一个案例:

我们已经准备好了,你呢?
2024我们与您携手共赢,为您的企业形象保驾护航