html5缓存sessionStorage localStorage

本文深入解析了本地存储技术,包括sessionStorage和localStorage的特性、使用方法及数据管理。sessionStorage适用于会话级存储,数据随窗口关闭而消失;localStorage提供永久性存储,除非主动删除,数据持久保存。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

本地存储的特性

1、数据存储在用户浏览器中
2、设置,读取方便,甚至页面刷新不会丢失数据
3、容量较大,sessionStorage约5M、localStorage约20M
4、只能存储字符串,可以将对象JSON.stringfy()编码后存储

window.sessionStorage

SessionStorage用于本地存储一个会话中的数据,这些数据只有在同一个会话中的页面才能访问并且会话结束,窗口关闭后,数据就会消失。是一种会话级别的存储。
1、生命周期为关闭浏览器窗口
2、在同一歌窗口下数据可以共享
3、以以键值对形式存储使用
设置数据

sessionStorage.setItem(key,value)

获取数据

sessionStorage.getItem(key)

删除数据

sessionStorage.remoeItem(key)

删除所有数据

sessionStorage.clear()

window.localStorage

LocalStorage是永久性的本地缓存,存储在客户端的浏览器上,除非主动删除,是不会过期的。LocalStorage采用的是键值对的方式进行存储,存储方式只能是字符串。存储内容可以用图片、json、样式、脚本等。
1、生命周期永久生效
2、可以多窗口(页面)共享(同一浏览器可以共享)
3、以键值对形式存储使用
设置数据

localStorage.setItem(key,value)

获取数据

localStorage.getItem(key)

删除数据

localStorage.remoeItem(key)

删除所有数据

localStorage.clear()

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值