js会话存储,本地存储

使用JS向浏览器的某一个位置中存储一些内容,浏览器即使关闭了,存储的信息也不会销毁,当在重新打开浏览器的时候我们依然可以获取到上一次存储的信息

在H5中提供了两种储存方式

localStorage:永久存储在客户端的本地
sessionStorage:信息的会话存储,会话窗口存在信息也存在,会话窗口关闭信息就消失了

sessionStorage

sessionStorag是一个全局对象

在这里插入图片描述

属性:
查看存储的数据个数:

sessionStorage .length

方法:
读取数据:

 sessionStorage.getItem('key'); 
 sessionStorage['key']; 

存储一个数据

sessionStorage .['key'] = 'value';
sessionStorage.setItem('key','value');

删除指定数据

sessionStorage.removeItem('value');

删除所有数据

sessionStorage.clear()
sessionStorage特点
  • sessionStorage 用于临时保存同一窗口(或标签页)的数据,在关闭窗口或标签页之后将会删除这些数据。
  • sessionStorage在浏览器关闭以后会自己清除掉
  • sessionStorage它不能跨普通的页面,也不能跨域
    在这里插入图片描述

在这里插入图片描述
两个不同的也不能公用一个sessionStorage;

  • window.open()或者 location对象方法打开的页面共享一个sessionStorage
  • 在sessionStorage中不管储存什么都会变成字符串类型
			sessionStorage["data"] = {};
			sessionStorage["arr"] = [1,2,3];
			sessionStorage["num"] = 1;
			sessionStorage["bool"] = true;
			console.log(sessionStorage)

在这里插入图片描述
所以在存储对象类型的时候可以,通过JSON.stringify()将对象转换为文本格式;读取时,通过JSON.parse()将文本转换回对象。

localStorage

在操作方面,sessionStorage和localStorage 的使用方法是一样的;

特点
  • localStorage在浏览器关闭以后还会存在,如果不是手动清除,它会一直存在

  • localStorage它可以跨页面,但是不能跨域(相同的域共享一 个 localStorage,不同的域不能共享localStorage)
    在这里插入图片描述
    在这里插入图片描述

  • 在localStorage中不管储存什么也会变成字符串类型

会话存储,本地存储的区别

相同点:

  • 都存储在客户端

不同点:

  • sessionStorage 会话级别的存储,存储只在同一个会话中的页面才能访问,会话结束后数据也随之销毁。
  • loaclStorage 关闭浏览器数据依旧会存在,用于持久化缓存本地数据,除非主动删除数据,否则数据永远不会过期。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值