localStorage与sessionStorage

localStorage和sessionStorage是HTML5提供的对于Web存储的解决方案。

相同点

  • 都与HTTP无关,是HTML5提供的标准,当发起HTTP请求时不会与Cookie一样自动携带。
  • 都是以键值对的形式存在,即Key-Value形式,常用的Api也相同。
  • 存储类型都是String类型,当进行存储时,会调用toString()方法转为String类型。
  • 对于每个域容量是有限的,不同浏览器不一样,大部分存储为5M左右。

不同点

  • localStorage用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的。
  • SessionStorage会在用户关闭浏览器后,即会话结束后,数据失效;SessionStorage与服务端Session无关。

常用操作

  • 储存数据
localStorage.setItem('key', 'value');
sessionStorage.setItem('key', 'value');
/**
* 由于存储数据会调用 toString() 方法
* Object 类型会存储为 [object Object] 字符串
* 所以进行存储时需调用 JSON.stringify() 转化为字符串
* 取出时调用 JSON.parse() 将字符串转回对象
*/
  • 读取数据
localStorage.getItem('key');
sessionStorage.getItem('key');
  • 删除数据
localStorage.removeItem('key');
sessionStorage.removeItem('key');
  • 清空数据
localStorage.clear();
sessionStorage.clear();

每日一题

https://github.com/WindrunnerMax/EveryDay

LocalStorage与SessionStorage的更多相关文章

  1. 似懂非懂的localStorage和sessionStorage

    一.区别 相信很多人都见过这两个关于HTML5的新名词!HTML5种的web storage包含两种存储方式:localStorage和sessionStorage,这两种方式存储的数据不会自动发给服 ...

  2. html5存储方式localstorage和sessionStorage

    html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage. 区别:localStorage无时间限制,除非主动删除数据,否则永不过期:sessio ...

  3. localstorage 和 sessionstorage 本地存储

    在我们日常的工作和实际项目中,做好数据数据缓存可以是我们的程序执行效率更高,可以使我们避免重复请求 服务器,减轻服务器的压力,可以提高使用户的体验度. 那么 HTML5 存储的目标是什么? 1.解决存 ...

  4. Cookie, LocalStorage 与 SessionStorage

    Cookie, LocalStorage 与 SessionStorage相同点 都是储存在用户本地的数据. 意义在于避免数据在浏览器和服务器间不必要地来回传递. 三者的特点     同属于html5 ...

  5. localStorage与sessionStorage 的区别

    通过一枚页面计数器来区别localStorage与sessionStorage. 通过一个计数变量pageconut,每刷新页面,增加的是localStorage的数量,而sessionStorage ...

  6. HTML5 学习笔记(三)——本地存储(LocalStorage、SessionStorage、Web SQL Database)

    一.HTML4客户端存储 B/S架构的应用大量的信息存储在服务器端,客户端通过请求响应的方式从服务器获得数据,这样集中存储也会给服务器带来相应的压力,有些数据可以直接存储在客户端,传统的Web技术中会 ...

  7. localStorage和sessionStorage

    首先自然是检测浏览器是否支持本地存储. 在HTML5中,本地存储是一个window的属性,包括localStorage和sessionStorage,从名字应该可以很清楚的辨认二者的区别,前者是一直存 ...

  8. HTML5 本地存储 localStorage、sessionStorage 的遍历、存储大小限制处理

    HTML5 的本地存储 API 中的 localStorage 与 sessionStorage 在使用方法上是相同的,区别在于 sessionStorage 在关闭页面后即被清空,而 localSt ...

  9. html5 Web Storage(localStorage(),sessionStorage())

    Web Storage包括了两种存储方式:sessionStorage和localStorage sessionStorage 是会话级别的存储,这些数据只有在同一个会话中的页面才能访问并且当会话结束 ...

  10. HTML5本地存储之localStorage、sessionStorage

    1.概述 localStorage和sessionStorage统称为Web Storage,它使得网页可以在浏览器端储存数据. sessionStorage保存的数据用于浏览器的一次会话,当会话结束 ...

随机推荐

  1. Css兼容性大全

    知识有所欠缺  疯狂脑补抄袭经验中... 兼容性处理要点1.DOCTYPE 影响 CSS 处理 2.FF: 设置 padding 后, div 会增加 height 和 width, 但 IE 不会, ...

  2. JSTL标签常用

    JSTL简介: 标准标签库JSTL的全名为:Java Server Pages Standard Tag Library. JSTL主要提供了5大类标签库: 1.       核心标签库: 为日常任务 ...

  3. IDEA如何自动添加注解作者等信息?

    1.点击File 2.点击Settings 3.点击Editor 4.点Live  Templates 5.点击左上角加号选中第2个 6.自定义命名,选中你自己创建的组,点击左上角加号选择第1个选项 ...

  4. 851. spfa求最短路

    给定一个n个点m条边的有向图,图中可能存在重边和自环, 边权可能为负数. 请你求出1号点到n号点的最短距离,如果无法从1号点走到n号点,则输出impossible. 数据保证不存在负权回路. 输入格式 ...

  5. CentOS7用yum安装wget命令后仍然提示命令找不到的解决方法

    需求:用的AWS实例自带的CentOS7用yum安装wget命令后扔提示命令找不到,后面用源码安装方式解决,下面先讲解决方法,疑问及知识点扩展最后写出 1.问题(因是mini版本系统,有些基本命令扔需 ...

  6. Java入门教程四(字符串处理)

    Java 语言的文本数据被保存为字符或字符串类型.字符及字符串的操作主要用到 String 类和 StringBuffer 类,如连接.修改.替换.比较和查找等. 定义字符串 直接定义字符串 直接定义 ...

  7. Scrum模拟微信看一看“疫情专区”的敏捷开发过程

    无论作为产品用户还是管理咨询顾问,都非常非常喜欢微信.自认感情比较克制属于“高冷”挂,但从很多方面都太佩服太崇拜张小龙了(新书里微信也会是最喜欢的案例之一,真的不只是一个产品而已,很多方面都太牛了). ...

  8. 操作系统-CPU管理的直观想法

    1. 管理CPU,先要使用CPU 管理CPU的最直观方法 2. 提出问题 有IO指令执行的特别慢,当cpu执行计算指令很快,遇到IO指令cpu进行等待,利用率不高. 使用多道程序.交替执行,这样cpu ...

  9. 简单说 JavaScript中的事件委托(下)

    说明 上次我们说了一些,关于 JavaScript中事件委托的 基础知识,这次我们继续来看. 解释 先来一段代码 <!doctype html> <html lang="e ...

  10. RuntimeError: No application found. Either work inside a view function or push an application context.

    记录: 遇到这种报错信息: 在create_all()生成数据表的时候,添加app=app,指明app对象即可-----> create_all(app=app)