Web Storage本地储存

本文深入解析HTML5中的WebStorage,涵盖sessionStorage与localStorage的区别及应用。sessionStorage适用于会话级存储,数据随会话结束而销毁;localStorage提供持久化存储,数据除非手动删除,否则永久保存。文中详细介绍了setItem、getItem、removeItem和clear四种操作方法。

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

Web Storage本地储存

HTML5中的储存包括两种:sessionStorage 和 localStorage
sessionStorage:用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储,仅仅是会话级别的存储。
localStorage:用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的。
sessionStorage提供了四个方法来辅助我们进行对本地存储做相关操作。

  1. setItem(key,value):添加本地存储数据。
  2. getItem(key):通过key获取相应的Value。
  3. removeItem(key):通过key删除本地数据。
  4. clear():清空数据。

代码:

//setItem存储value
//用途:将value存储到key字段
//用法:.setItem( key, value)
//代码示例:
sessionStorage.setItem("key", "value");
localStorage.setItem("site", "js8.in");

//getItem获取value
//用途:获取指定key本地存储的值
//用法:.getItem(key)
//代码示例:
var value = sessionStorage.getItem("key");  
 var site = localStorage.getItem("site");

//removeItem删除key
//用途:删除指定key本地存储的值
//用法:.removeItem(key)
//代码示例:
sessionStorage.removeItem("key"); 
localStorage.removeItem("site");

//clear清除所有的key/value
//用途:清除所有的key/value
//用法:.clear()
//代码示例:
sessionStorage.clear();
localStorage.clear();
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值