被遗忘的sessionStorage实现每次打开网页只执行一次的操作

被遗忘的sessionStorage实现每次打开网页只执行一次的操作

前言

我们经常会遇到某种需求:网站打开执行一次,之后进入相同的页面不再执行,关闭网站下次再进又会执行。很容易就会让人想到用本地存储来做,但具体用localStorage还是sessionStorage呢,这就要看一下三者之间的区别。

localStorage和sessionStorage异同

  1. 相同点 :存储大小限制一般都为5MB,只保存在客户端(即浏览器)中;
  2. 不同点localStorage除非被清除,否则永久保存;而sessionStorage仅在当前会话下有效,关闭页面或浏览器后被清除。

我们可以在浏览器上试一试

  1. 随便打开一个网站,打开谷歌控制台,分别用localStorage和sessionStorage存点东西
    在这里插入图片描述
  2. 然后就可以在控制台Application栏里面的localStorage和sessionStorage对应网站域名下面的找到刚才存的数据了;
    在这里插入图片描述
  3. 我们刷新网页试试,会发现刷新完之后localStorage和sessionStorage存储的数据再刷新网页之后依然存在。
  4. 关闭当前网页再次打开,发现localStorage依然存在
    在这里插入图片描述
    而sessionStorage里面存储的数据被清掉了
    在这里插入图片描述
    所以我们就可以确定当初的需求可以用sessinoStorage来做了。

具体实现

var params = sessionStorage['params'] || '';
if(params==''){
	sessionStorage['params'] = '1';
	//这里执行需要执行的操作
}

搞定收工!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值