本地存储基础

2023-10-30

本地存储特性

1.数据存储在用户浏览器中

2.设置、读取方便、甚至页面刷新不丢失数据

3.容量较大、sessionStorage约5M、localStorage约20M

4.只能存储字符串、可以将对象JSON.stringify()编码后存储

sessionStorage和localStorage的区别:

同:1、localStorage和sessionStorage一样都是用来存储客户端临时信息的对象。

2、他们均只能存储字符串类型的对象(虽然规范中可以存储其他原生类型的对象,但是目前为止没有浏览器对其进行实现)。

异:1、localStorage生命周期是永久,这意味着除非用户显示在浏览器提供的UI上清除localStorage信息,否则这些信息将永远存在。

2、sessionStorage生命周期为当前窗口或标签页,一旦窗口或标签页被永久关闭了,那么所有通过sessionStorage存储的数据也就被清空了。

3、不同浏览器无法共享localStorage或sessionStorage中的信息。相同浏览器的不同页面间可以共享相同的 localStorage(页面属于相同域名和端口),但是不同页面或标签页间无法共享sessionStorage的信息。这里需要注意的是,页面及标 签页仅指顶级窗口,如果一个标签页包含多个iframe标签且他们属于同源页面,那么他们之间是可以共享sessionStorage的。

Cookie

  1. 什么是Cookie

Cookie的英文直译是饼干,在计算机术语中是指一种能够让网站服务器把少量数据储存到客户端的硬盘或内存,或是从客户端的硬盘读取数据的一种技术。指某些网站为了辨别用户身份、进行 session 跟踪而储存在用户本地终端上的数据(通常经过加密)。

  1. 作用

当你访问了某些网页,并且对网页的一些设置进行修改,cookies就能跟踪并记录到这些修改,当你下一次访问这个网页的时候,这个网页会分析你电脑上的cookies,进而采取措施像你返回更符合你个性化的网页;

当然,目前大部分广告的定位基础也是基于cookies的,比如你此前访问了大量的健身类网站,cookies记录了你的访问行为,广告主就能够根据你的访问行为,向你推送健身类的广告。“是否让浏览器记住你的密码?”这句话你是否还记得,我们在浏览器首次登陆某个网站的时候,就会弹出该提示,提醒我们保存账号密码,下次访问就不再需要输入账号密码了,这是Cookie的作用之一,但保存在计算机中的Cookie信息是一个比较私密的内容

本地存储window.sessionStorage

1.生命周期为关闭浏览器窗口

2.在同一个窗口(页面)下数据可以共享

3.以键值对的形式存储使用

本地存储 window.localStorage

1.生命周期永久生效,排除手动删除否则关闭页面也会存在

2.可以多窗口(页面)共享(同一浏览器可以共享)

3.以键值对的形式存储使用

储存数据

获取数据

删除数据

删除所有数据

本地存储的核心思路:

不管按下回车,还是点击复选框,都是把本地存储的数据加载到页面中,这样保证刷新关闭页面不会丢失数据

存储的数据格式:

但是本地存储里面只能存储字符串的数据格式,把我们的数组对象转换为 字符串格式JSON.stringify()

获取本地存储的数据,我们需要把里面的字符串数据转换为 对象格式JSON.parse()

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

本地存储基础 的相关文章

  • 如何将 java ArrayList 转换为等效的 double[] [重复]

    这个问题在这里已经有答案了 可能的重复 如何在 Java 中从 List 转换为 double https stackoverflow com questions 6018267 how to cast from listdouble to
  • HTTPURLConnection 不遵循从 HTTP 到 HTTPS 的重定向

    我不明白为什么JavaHttpURLConnection不遵循从 HTTP 到 HTTPS URL 的 HTTP 重定向 我使用以下代码来获取页面https httpstat us https httpstat us import java
  • json文件格式的升级路径

    我们将 Java 应用程序的用户首选项存储在 JSON 文件中 使用Jackson http jackson codehaus org 随着我们继续开发该应用程序 我们将添加首选项 重命名首选项并删除过时的首选项 当用户将应用程序升级到下一
  • 节省页面加载时间的提示[重复]

    这个问题在这里已经有答案了 我的问题 削减那些不必要的 kb 并使页面加载速度更快的最佳方法是什么 全部是什么优化实践 编码实践 在js php中 如果执行可以使您的页面更轻 为什么我问这个 我读了这篇关于 jquery js 与 jque
  • 处理大数据表时应该如何使用Hibernate Mapping

    问题定义 我有一个包含大量数据 超过 100 000 行 的数据库表 表结构如下 AppID DocID DocStatus 1 100 0 1 101 1 2 200 0 2 300 1 每个 applicationID 可能有数千个文档
  • 版本差异? Java 中的正则表达式转义

    看来正则表达式转义在不同版本的 Java 中的工作方式不同 在 Java openjdk 16 0 1 中编译工作正常 在 Java openjdk 11 0 11 中抛出此编译错误 test java 15 error illegal e
  • 如何制作一个向用户显示图像而不是文本的下拉列表?

    ObjectChoiceField 字段满足我的所有要求 但它并不漂亮 这就是我所拥有的 String pets Dog Cat Duck ObjectChoiceField dd new ObjectChoiceField My Pet
  • 如果验证失败,如何在 ASP.NET MVC 中阻止 jquery ajax 提交

    我在用ASP NET 5 MVC RC1 我的 ASP NET MVC 使用的 jquery 验证插件是默认 ASP NET 5 模板项目使用的标准 jquery validate js jQuery Validation Plugin v
  • 无法为对象堆保留足够的空间

    每次尝试运行该程序时 我都会重复出现以下异常 VM初始化期间发生错误 无法为对象堆保留足够的空间 无法创建Java虚拟机 我尝试增加虚拟内存 页面大小 和 RAM 大小 但无济于事 我怎样才能消除这个错误 运行 JVM XX MaxHeap
  • AWS Lambda 和 S3 - 上传的 pdf 文件为空/损坏

    我有一个 Spring 应用程序 在 AWS Lambda 上运行 它获取文件并将其上传到 AWS S3 Spring控制器发送一个MultipartFile到我的方法 使用 Amazon API Gateway 将其上传到 AWS S3
  • Ajax调用完成后执行函数

    我是 Ajax 新手 我尝试在使用 for 循环时使用 Ajax Ajax 调用之后 我正在运行一个使用 Ajax 调用中创建的变量的函数 该函数只执行两次 我认为 Ajax 调用可能没有足够的时间在循环开始之前进行调用 有没有办法在运行
  • 如何在 JUnit 中缩短(或隐藏)包名称?

    我在 JUnit 中有很长的包名称 这使得很难看到正在运行哪些测试 不幸的是 使用 Eclipse 的 缩写包名称 不起作用 有没有办法隐藏或者最好缩短它们 None
  • Java编译错误:包不存在

    在我的工作区 wsPrivate 中 我有 3 个 gradle 项目 刽子手 像素视图 Reports PixelView 和 Reports 项目编译良好 然而 Hangman 使用这两个项目 并且有些在编译时找不到包 请参阅以下错误
  • 当字段已经填充时,jQuery Validate 有时无法工作

    我的页面中有一个更新表单 所有文本框都已填充用户信息 我用了jquery 验证 https jqueryvalidation org 我的网站中的插件 当表单没有任何默认值时 该插件可以正常工作而不会出现任何错误 在我的表单中 有时错误消息
  • 如何使用 Java 1.4 和 SAX 将任意数据编码为 XML?

    我们使用 SAX 来解析 XML 因为它不需要将整个 XML 文档读入内存来解析单个值 我读过很多文章 坚持认为 SAX 只能用于解析 解码 XML 而不能创建它 这是真的 不 这不是真的 您可以使用类似于以下内容的方式将 XML 编码为
  • 根据另一个列表的顺序对列表进行排序[重复]

    这个问题在这里已经有答案了 我需要对列表进行排序Person对象 List
  • 有没有办法让 SonarQube 只警告不完整的 Switch 语句?

    使用 Java SonarQube 抱怨枚举值上的 switch 语句没有default case 给出的推理是 最终默认条款的要求是防御性编程 该条款应采取适当的行动 或包含 关于为什么不采取行动的适当评论 当开关盖上时 枚举的所有当前值
  • 以特定顺序运行具有效果的 jQuery 函数

    我在 javascript 函数中有一些 jQuery 可以更改页面上的文本并以特定的时间间隔淡入和淡出 我希望这些函数在每个函数完成其效果后按顺序运行 dialogueExchange1 dialogueExchange2 dialogu
  • 动态 jquery 对话框弹出窗口

    我只使用过已知数量的 JQuery 对话框 并且在使动态版本正常工作时遇到了各种麻烦 希望有人能帮助我解决这个问题 这是我用已知数字执行此操作的方法 opener1 click function dialog1 dialog open di
  • 指定不带组件的GridBagLayout的网格参数

    我试图帮助另一个用户 但遇到了一个问题 我想用 GridBagLayout 来做到这一点 c1 c2 c3 10 80 10 v v r1 B1

随机推荐

  • FBX SDK环境配置

    参照这个https blog csdn net lilysara article details 53940353 注意事项1 选择lib文件夹的时候注意和电脑配置匹配 不匹配的话会报这个错误 配置成功后可以引入fbxsdk头文件 并调试运
  • 高手在交易中总结的期货

    知与行 常听说 做期货 知易行难 但我认为 当 知 的问题解决了 行 就不是问题 知 可以理解为盈利模式 有了盈利模式 严格执行 做到 知行合一 自然就可以做到长期持续盈利 因此 知易行难 常是认识的误区 当你发现 行难 时 其实是 知 的
  • 以太网 ARP

    在以太网中 一个主机和另一个主机进行通信 必须要知道目的主机的 MAC 地址 物理地址 而目的 MAC 地址的获取由 ARP 协议完成 ARP 概述 ARP Address Resolution Protocol 即地址解析协议 是根据 I
  • golang字符串首字母转化为大写

    字符串首字母转化为大写 字符串首字母转化为大写 ios bbbbbbbb gt iosBbbbbbbbb func strFirstToUpper str string string temp strings Split str var u
  • mysql模糊搜索 like_Mysql必知必会(3):模糊查询(LIKE)

    本文介绍什么是通配符 如何利用通配符进行数据库数据过滤查询 本文使用的数据表在本文最后附录 简介 之前几篇文章的所有例子查询的条件都是确定的值 比如大于20 或者用户ID为1 但是 有些时候我们需要查询一些不太确定的值 比如用户在输入框输入
  • 算法之回溯算法

    目录 前言 如何理解回溯算法 两种回溯算法的经典应用 1 0 1背包 2 正则表达式 总结 参考资料 前言 很多经典的数学问题都可以用回溯算法解决 比如数独 八皇后 0 1 背包 图的着色 旅行商问题 全排列等等 用来指导像深度优先收索这种
  • 40-400-044-运维-优化-MySQL order by 优化

    文章目录 1 概述 2 MySQL中的两种排序方式 3 ORDER BY优化的核心原则 4 ORDER BY优化实战 ORDER BY优化 WHERE ORDER BY 优化 Filesort优化 1 概述 本篇文章我们将了解ORDER B
  • 【BUG

    问题 运行Inpaint Anything时 pycharm中的conda环境下的tensorflow问题 2023 04 19 10 53 30 485189 I tensorflow core platform cpu feature
  • [非卷积5D] NeRF: Representing Scenes as Neural Radiance Fields for View Synthesis

    不使用3D建模 使用静态图片进行训练 用 非卷积 深度网络表示场景的5D连续体表示 再通过ray marching进行渲染 paper NeRF Representing Scenes as Neural Radiance Fields f
  • idea数据库表生成实体类

    先说一下实现的功能 根据数据库 生成实体类 生成的实体类的格式可参看下图 生成的实体类中加入的注解有 Table注解 无getset方法 加入了lombok的 DATA Slf4j注解 支持 ID注解 当字段名为id时 如果数据库表中字段通
  • java比较string是否相同

    比较引用 equals 比较值 1 java中字符串的比较 我们经常习惯性的写上if str1 str2 这种写法在java中可能会带来问题 example1 String a abc String b abc 那么a b将返回true 因
  • 弹性盒子(flex布局)

    传统布局 兼容性好 布局繁琐 局限性 不能再移动端很好的布局 flex弹性布局 操作方便 布局极为简单 移动端应用广泛 PC端浏览器支持情况较差 布局原理 flex意为 弹性布局 用来为盒状模型提供最大的灵活性 任何一个容器都可以指定为fl
  • .net core 整洁架构入门

    Clean Architecture with NET Core Getting Started 使用 NET Core整洁架构 Clean Architecture 入门 Over the past two years I ve trav
  • 融合黄金正弦,十种混沌映射,搞定!把把最优值,本文思路可用于所有智能算法的改进...

    上一期的2023年最新优化算法之减法优化器算法 SABO 效果已经相当不错了 而且由于其十分简单的公式原理 更适用于刚接触智能优化算法的小伙伴 今天这篇文章为大家带来 融合黄金正弦的减法优化器 GSABO 本文会讲解一下改进思路 为各位小伙
  • 流程型和离散型制造行业mes系统的区别

    流程型和离散型制造行业mes系统的区别 在制造信息化的时代背景之下 MES系统 被越来越多的企业重视 虽然MES系统在制造行业中有着巨大的价值 但是不同的企业对MES系统的需求也存在很大的差异性 比较突出的就是流程型和离散型这两个方面 那么
  • 修改linux命令行终端的显示区行数列数

    stty rows 50 columns 200
  • Bugkuctf web 前女友

    老规矩 有新东西就记上一记 题目链接 这个有点儿意思 打开源码 好了 代码意思比较简单 重点看圈住的代码就好 满足v1v2的值不等但是md5相等 且v3 flag才行 好了 新知识来了 首先是md5 函数漏洞 第一种 GET a GET b
  • Web自动化Selenium-获取页面元素的相关信息

    获取页面元素的信息主要有两个目的 一是执行完步骤后进行断言 二是获取前一步骤的响应结果 将其作为后续步骤的输入或判断条件 获取元素的基本信息 目的输出元素的大小 文本 标签名 关键字 tag name 输出元素的标签名 size 输出元素的
  • TCP/IP协议,HTTP协议--面试必备

    经常面试被问到什么是http协议 什么是TCP协议 而且每次都弄不清楚 是时候记录一下了 一 什么是http协议 如果读者对计算机网络的体系结构比较了解的话应该清楚 IP协议位于网络层 TCP UDP协议位于传输层 HTTP位于应用层 如下
  • 本地存储基础

    本地存储特性 1 数据存储在用户浏览器中 2 设置 读取方便 甚至页面刷新不丢失数据 3 容量较大 sessionStorage约5M localStorage约20M 4 只能存储字符串 可以将对象JSON stringify 编码后存储