FE_本地存储LocalStorage和SessionStorage

news2025/1/31 3:08:28
  1. localStorage和sessionStorage一样都是用来存储客户端临时信息的对象。
  2. 他们均只能存储字符串类型的对象。
  3. localStorage生命周期是永久,这意味着除非用户主动在浏览器上清除localStorage信息,否则这些信息将永远存在。
  4. sessionStorage的失效时间为当前会话是否被关闭, 如果当前会话中存储有key和value,会话关闭数据则消失,所以我们可以得到结论,sessionStorage的失效取决于会话

1 localStorage

  1. LocalStorage的存储大小一般为5M
  2. LocalStorage的存储类型为字符串
  3. LocalStorage若想要删除,需要人为删除

1.1 存储数据

在这里插入图片描述
在这里插入图片描述

1.2 获取数据

    getLocalStorage() {
      console.log(window.localStorage.getItem("name"));
    }

1.3 删除指定的本地数据

    removeLocalStorage() {
      window.localStorage.removeItem('name')
    }

1.4 删除当前域名下所有内容

localStorage.clear()

1.5 LocalStorage的局限性

  1. LocalStorage在IE浏览器中,IE8以上才支持LocalStorage。
  2. LocalStorage在浏览器的隐私模式下无法读取。
  3. LocalStorage存储的类型仅限于string类型,所以在存储其他类型的时候需要相应的转化。

2 SessionStorage

SessionStorage的用法和LocalStorage用法基本上一样,唯一的区别就是localStorage属于永久性存储,而sessionStorage属于当会话结束的时候,sessionStorage中的键值对会被清空。

  1. 存储数据:sessionStorage.setItem(“自定义数据名”, 数据)
  2. 取存储的本地数据:sessionStorage.getItem(“存储数据的数据名”)
  3. 删除指定的本地数据:sessionStorage.removeItem(“存储数据的数据名”)
  4. 删除当前域名下所有内容:sessionStorage.clear()

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/521276.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Wine运行器3.2.2——修复一些问题

不写太多啥了,详细介绍看这里就行:https://bbs.deepin.org/post/248098 更新内容 ※1. 修改源地址(迁出 Gitlink); ※2. 修复非 X86 架构运行器主页面虚拟机工具禁用的问题; 3、部分组件支持选择最优源。 …

C语言——数据类型

1. 变量 1.1变量的概念 变量就是在程序中可以发生变化的量,变量有类型。 变量的类型决定了变量存储占用的空间,以及如何解释存储的位模式。(1字节8位) 1.2定义格式 存储类型 数据类型 变量名;例如:(auto) int a; 变量名是标识…

Unity2d光源的使用

将项目升级为2dURP 安卓UPR插件 新建URP配置文件 (只有完成第一步操作之后才会有创建的选项) 右键>Create>Rendering>URP Asset (with 2D Renderer) 修改Project Settings(项目设置里面的相关设置) Edit>Project Settings>Graphics>设置Scriptable R…

组件弹框传值

1.引入组件 // 编辑干部弹窗 import edit from "../../components/rm/edit.vue"; 2.注册组件 components: {edit,}, 3.使用组件 <edit ref"edit" :visible.sync"editVisible" :rmid"UpFileData.id" :width"editWidth"…

股票量价关系基础知识4

价量配合与价量背离 在股票市场中&#xff0c;价的变化会引起量的变化&#xff0c;量的变化又会引起价的波动。从整体来看&#xff0c;价量关系主要存在两种情况&#xff1a;价量配合和价量背离。 一、价量配合 &#xff08;一&#xff09;基本概念 价量配合&#xff0c;是指股…

leecode255——二叉树的所有路径代码及示例

&#x1f50e;递归法&#xff1a; 既然是递归法&#xff0c;递归三部曲&#xff1a; &#xff08;1&#xff09;确定终止条件: 对二叉树的路径&#xff0c;遍历到叶子节点结束。本题要找到叶子节点才开始处理后续流程&#xff0c;那什么时候算是找到了叶子节点&#xff0c;即…

尚硅谷JUC

文章目录 1. 什么是JUC1.1 JUC简介1.2 进程和线程基本概念2.1 Synchronized2.1.1 Synchronized关键字2.1.2 synchronized实现三个线程卖30张票 2.2 Lock2.2.1 什么是Lock2.2.2 使用Lock实现买票功能2.2.3 两者的区别 3. 线程间通信及定制化通信3.1 使用synchronized实现线程之间…

【Windows线程开发】Windows线程同步技术

我们在上一章节中讲解了关于Windows的线程基础&#xff0c;相信大家已经对线程有了基本的概念。这一章节中&#xff0c;我们来讲讲线程同步技术&#xff0c;包括加锁技术&#xff08;原子锁和互斥体&#xff09;和事件&#xff0c;信号灯。 文章目录 一.原子锁二.互斥体三.事件…

SpringCloud-网关 Gateway

网关Gateway 一、网关初识二、网关的使用1.创建项目并引入依赖2.编写网关配置3.启动服务并测试 三.查看网关路由规则列表四.路由服务的负载均衡五.断言和过滤1.断言Predicate1.1.The Path Route Predicate Factory(路径断言工厂&#xff09;1.2.The After Route Predicate Fact…

【27】linux进阶——rpm软件包的管理

大家好&#xff0c;这里是天亮之前ict&#xff0c;本人网络工程大三在读小学生&#xff0c;拥有锐捷的ie和红帽的ce认证。每天更新一个linux进阶的小知识&#xff0c;希望能提高自己的技术的同时&#xff0c;也可以帮助到大家 另外其它专栏请关注&#xff1a; 锐捷数通实验&…

基于SSM+MySQL的支教管理系统

目录 1、系统介绍 2、系统功能展示 3、运行环境 4、运行效果 5、运行配置 6、下载地址 1、系统介绍 本系统是基于SSM(SpringSpringMVCMyBatis)框架开发的支教管理系统&#xff0c;系统共有超级管理员&#xff0c;系统管理员&#xff0c;支教学校&#xff0c;志愿者这四大…

我的新书上架了!

talk is cheap&#xff0c;show you my book&#xff01; 新书《从0开始学ARM》终于在各大平台上架了&#xff01;&#xff01; 一、关于本书 1. 本书主要内容 ARM体系架构是目前市面上的主流处理器体系架构&#xff0c;在手机芯片和嵌入式芯片领域&#xff0c;ARM体系架构…

前端架构师-week5-命令行交互原理

目录 加餐&#xff1a;命令行交互原理 学习路径 readline 源码分析 如何开发命令行交互列表 实现原理 架构图 本章学习路径和学习目标 readline 的使用方法和实现原理 高能&#xff1a;深入讲解 readline 键盘输入监听实现原理 秀操作&#xff1a;手写 readline 核心实…

MySQL---控制流函数、窗口函数(序号函数、开窗聚合函数、分布函数、前后函数、头尾函数、其他函数)

1. 控制流函数 格式 解释 案例 IF(expr,v1,v2) 如果表达式 expr 成立&#xff0c;返回结果 v1&#xff1b;否则&#xff0c;返回结果 v2。 SELECT IF(1 > 0,正确,错误) ->正确 IFNULL(v1,v2&#xff09; 如果 v1 的值不为 NULL&#xff0c;则返回 v1&#xff…

JVM垃圾收集器(一)

目录 1、如何考虑 GC 2、如何确定一个对象“死去” 3、分代收集理论 4、垃圾回收算法 5、HotSpot的算法实现细节 1、如何考虑 GC 垃圾收集&#xff08;Garbage Collection&#xff0c;GC&#xff09;的历史比Java更久远&#xff0c;1960年诞生于MIT。 GC 需要考虑的三件事…

UNIAPP实战项目笔记72 提交订单到选择支付方式的前后端交互

UNIAPP实战项目笔记72 提交订单到选择支付方式的前后端交互 思路 购物车确认订单,跳转到订单确认界面确认支付后清除购物车对应id的数据 实例截图 清空购物车数据后 代码 前端代码 order.js export default{state:{// 订单号orderNumber:},getters:{},mutations:{initOr…

数字化转型浪潮下,如何选择适合企业的低代码平台

近日&#xff0c;艾瑞咨询发布了《数字新生态&#xff1a;中国低代码厂商发展白皮书》&#xff08;以下简称“报告”&#xff09;&#xff0c;在该报告中&#xff0c;艾瑞咨询对中国当前的低代码市场进行了非常细致的解构&#xff0c;并针对当前企业数字化转型&#xff0c;对低…

电阻传感器工作原理

金属随着温度变化&#xff0c;其电阻值也发生变化。 对于不同金属来说&#xff0c;温度每变化一度&#xff0c;电阻值变化是不同的&#xff0c;而电阻值又可以直接作为输出信号。 电阻共有两种变化类型 正温度系数 温度升高 阻值增加 温度降低 阻值减少 负温度系数 温…

【一起啃书】《机器学习》第七章 贝叶斯分类器

文章目录 第七章 贝叶斯分类器7.1 贝叶斯决策论7.2 极大似然估计7.3 朴素贝叶斯分类器7.4 半朴素贝叶斯分类器7.5 贝叶斯网7.6 EM算法 第七章 贝叶斯分类器 7.1 贝叶斯决策论 对分类任务来说&#xff0c;在所有相关概率都已知的理想情形下&#xff0c;贝叶斯决策论考虑如何基于…

k8s学习-CKS真题-利用AppArmor进行应用行为限制

目录 题目环境搭建解题模拟题参考 题目 Task 在 cluster 的工作节点 node02 上&#xff0c;实施位于 /etc/apparmor.d/nginx_apparmor 的现有 APPArmor 配置文件。 编辑位于 /cks/KSSH00401/nginx-deploy.yaml 的现有清单文件以应用 AppArmor 配置文件。 最后&#xff0c;应用清…