SessionStorage和LocalStorage

一、本地存储是什么?

Webstorage定义了两个对象:sessionStorage和localStorage。sessionStorage是跨会话的存储机制,localStorage是永久存储机制。这两种浏览器存储API提供了在浏览器中不受页面刷新影响而存储数据的两种方式。
数据存储在用户浏览器中;
设置、读取方便、甚至页面刷新不丢失数据;
容量较大,约5M。

二、sessionStorage对象

1.介绍

它可以将数据存储到浏览器中。可以通过F12找到Application中的SessionStorage查看哪些数据被存储进来了。

① 声明周期为关闭浏览器窗口;(关闭浏览器窗口就没有了)
② 在同一个窗口(页面)下数据可以共享;
③ 以键值对的形式存储使用。

2.使用

      存储数据:sessionStorage.setItem(key,value)
      获取数据:sessionStorage.getItem(key)
      删除数据:sessionStorage.removeItem(key)
      清空所有数据:sessionStorage.clear()    

sessionStorage对象主要用于存储只在会话期间有效的小块数据。如果需要跨会话持久存储数据,可以使用localStorage。

三、localStorage对象

1.介绍

在修订的HTML5规范里,localStorage对象取代了globalStorage,作为在客户端持久存储数据的机制。localStorage可以将数据存储到浏览器中。可以通过F12找到Application中的LocalStorage查看哪些数据被存储进来了。
① 生命周期永久生效,除非手动删除,否则关闭页面,也会存在;
② 可以多窗口(页面)共享(同一种浏览器可以共享);
③ 以键值对形式存储使用。

2.使用

      存储数据:localStorage.setItem(key,value)
      获取数据:localStorage.getItem(key)
      删除数据:localStorage.removeItem(key)
      清空所有数据:localStorage.clear()  

总结

以上就是今天要分享的内容,本文仅仅简单介绍了SessionStorage和LocalStorage的使用。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值