sessionStorage

发表于2021-09-23|更新于2026-02-24

|浏览量:

勤奋是一种可以吸引一切美好事物的天然磁石。 ——罗•伯顿

前端除了localStorage还有sessionStorage

localStorage即便关闭了浏览器，再次打开该页面仍然存在

但sessionStorage的作用于仅仅局限于当前标签页或通过当前标签页中的点击事件打开的新页面

localStorage一般用于用户token储存、主题设置等需要稍微长期持久化的场景

sessionStorage一般用于刷新页面记住分页页码、记住检索条件等关闭标签页即销毁的场景

sessionStorage的api和localStorage的api非常相似：

1 2	// 存 sessionStorage.setItem("ruben","ruben")

取出来：

1 2	// 取 sessionStorage.getItem("ruben")

相关推荐

MutationObserver监听dom变化

人生意义到底是什么呢？吃得好一点，睡得好一点，多玩玩，不羡慕别人，不听管束，多储蓄人生经验，死而无憾，这就是最大的意义吧，一点也不复杂。—— 蔡澜《不如任性过生活》 mdn: MutationObserver.MutationObserver() - Web API | MDN MutationObserver.observe() - Web API | MDN 代码如下： 12345678910111213 let app = document.querySelector("#app")var observerOptions = { attributes: true, // 观察属性变动 childList: true, // 观察目标子节点的变化，是否有添加或删除 subtree: true // 观察后代节点，默认为false}// 创建一个DOM监听器，在DOM更新完成时触发let observer = new MutationObserver((mutationsList, obs...

懂得生命真谛的人，可以使短促的生命延长。——西塞罗代码如下： 1"token".split(".").slice(0,2).map(i=>JSON.parse(atob(i))) 当我在解析 jwt 的 token 时，发现 token 中附带的用户 id 存在精度丢失问题，然后用正则改进解析 JWT 的代码： 1const tokenParse = token => token.split(".").slice(0, 2).map(i => JSON.parse(atob(i).replace(/:\s*([-+]?\d+(\.\d+)?([eE][-+]?\d+)?)/g, (match, p1) => Math.abs(p1) > Number.MAX_SAFE_INTEGER ? `:"${p1}"` : `:${p1}`))); 但是还存在 base64 解码时无法正确解码中文问题，继续改进 1const tok...

byte二维码在img中展示

睡在哪里都是睡在黑夜里。——贾平凹《废都》我们使用hutool的工具类生成二维码图片后，如果转为byte数组，返还给前端，我们要放入img中显示 12345@GetMapping("generateCode")@ResponseBodypublic byte[] generateCode() { return QrCodeUtil.generatePng("https://VampireAchao.github.io/", QrConfig.create().setImg(ImgUtil.getImage(URLUtil.url("/img/oss/2020-06-01/head.jpg"))));} 直接放到src是不行的，需要在前面加一个data:image/jpeg;base64, 最终变成这样效果图：

vue中新增属性视图问题

计利当计天下利，求名应求万世名——于右任我们在进行vue前端开发的时候，可能会遇到这种情况：首先我们此处双向绑定了一个变量中的属性 12345<template> <div> <div>{{ myObject.newProperty }}</div> </div></template> 然后下面的data只有该对象变量，并无此属性 12345678<script>export default { data() { return { myObject: {} }; }</script> 此时我们调用一个方法，给它的新增变量赋值 1this.myObject.newProperty = 'ruben'; 可以看到外部是并未监听到，视图没有更新，导致我们页面没渲染上去该变量属性的值此处我们当然可以使用vm.$forceUpdate去强制更...

hexo-bilibili-bangumi

练习是良好的老师。——贺拉斯分享一个hexo插件： https://github.com/HCLonely/hexo-bilibili-bangumi hexo 番剧页面插件，可选数据源：Bilibili, Bangumi Demo 安装 1$ npm install hexo-bilibili-bangumi --save 配置将下面的配置写入站点的配置文件 _config.yml 里(不是主题的配置文件). 12345678910111213141516171819202122232425262728293031323334353637383940414243bangumi: # 追番设置 enable: true source: bili bgmInfoSource: 'bgmApi' path: vmid: title: '追番列表' quote: '生命不息，追番不止！' show: 1 lazyload: true srcValue: '__image__'...

jquery在iframe中选中父元素节点

忧劳可以兴国，逸豫可以亡身。——《新五代史·伶官传序》我们在使用如layui的layer弹窗或者在页面上用别的方式打开的iframe中可能会要获取到父页面的某个元素可以使用： 1window.parent.$(".layui-laypage-btn") 这里.layui-laypage-btn是父元素的节点主要是 window.parent这个属性，能返回当前窗口的父窗口

阿超

我的名字叫阿超年龄25岁家在北京市职业是软件开发每天最晚也会在八点前回家不抽烟酒浅尝辄止晚上十二点上床保证睡足八个小时睡前写一篇博客再做二十分钟俯卧撑暖身然后再睡觉基本能熟睡到天亮像婴儿一样不留下任何疲劳和压力就这样迎来第二天的早晨健康检查结果也显示我很正常我想说明我是一个不论何时都追求内心平稳的人不拘泥于胜负不纠结于烦恼不树立使我夜不能寐的敌人这就是我在这社会的生活态度

数据加载中