说明:

Web Storage 包含如下两种机制:

  • sessionStorage 为每一个给定的源(given origin)维持一个独立的存储区域,该存储区域在页面会话期间可用(即只要浏览器处于打开状态,包括页面重新加载和恢复)。
  • localStorage 同样的功能,但是在浏览器关闭,然后重新打开后数据仍然存在。

这两种机制是通过 Window.sessionStorage 和 Window.localStorage 属性使用(更确切的说,在支持的浏览器中 Window 对象实现了 WindowLocalStorage和 WindowSessionStorage 对象并挂在其 localStorage 和 sessionStorage 属性下)—— 调用其中任一对象会创建 Storage 对象,通过 Storage 对象,可以设置、获取和移除数据项。对于每个源(origin)sessionStorage 和 localStorage 使用不同的 Storage 对象——独立运行和控制。

例如,在文档中调用 localStorage 将会返回一个 Storage 对象;调用 sessionStorage 返回一个不同的 Storage 对象。可以使用相同的方式操作这些对象,但是操作是独立的。

参考:

https://developer.mozilla.org/zh-CN/docs/Web/API/Window/localStorage

https://developer.mozilla.org/zh-CN/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API

https://developer.mozilla.org/zh-CN/docs/Web/API/Window/sessionStorage

https://www.cnblogs.com/st-leslie/p/5617130.html

HTML5本地缓存localStorage和sessionStorage的操作方法收集的更多相关文章

  1. HTML5本地存储localStorage与sessionStorage

    在最近的项目中用到了html5的本地存储,下面总结一下. 1.html5几种存储形式 本地存储(localStorage && sessionStorage) 离线缓存(applica ...

  2. HTML5本地存储localStorage与sessionStorage详解

    前言 在最近的项目中用到了html5的本地存储,下面总结一下. 1.html5几种存储形式 本地存储(localStorage && sessionStorage) 离线缓存(appl ...

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

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

  4. HTML5本地存储localStorage、sessionStorage及IE专属UserData

    By:王美建 from:http://www.cnblogs.com/wangmeijian/p/4518606.html 转载请保留署名和出处! 在客户端存储数据用的最普遍的方式非cookie莫属, ...

  5. HTML5本地存储localStorage、sessionStorage基本用法、遍历操作、异常处理等

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

  6. HTML5本地存储 localStorage 和 sessionStorage 的基本用法及属性

    localStorage 和 sessionStorage 的用法都是本地的存储和获取 但他们又有所区别, 1, sessionStorage 是一个短暂的本地存数,它会随着浏览器的刷新和关闭而消失, ...

  7. html5的本地存储localStorage和sessionStorage

    html5的本地存储localStorage和sessionStorage html5中新增的比较重要的一个功能就是web storage来实现客户端本地存储数据,之前存储数据都是用cookie来实现 ...

  8. hybrid app开发中用到的html5新特性localStorage、sessionStorage和websql database

    近期在项目中进行hybrid app开发,项目中有大量的js代码执行在android设备上. 使用到了非常多HTML5的新特性,之前没有遇到过,不了解.这里记录下添加点前端的知识.混合式app开发中. ...

  9. HTML5本地缓存数据

    //HTML5本地缓存数据 function putObj(key, data) { if (!!window.localStorage) { var obj = { "key": ...

随机推荐

  1. 封装常用的Javascript跨浏览器方法

    var EventUntil={ // 跨浏览器的添加事件方法 addHandler:function(element,type,handler){ if(element.addEventListen ...

  2. flume高级组件及各种报错

    1,one source two channel 创建conf文件,内容如下: #定义agent名, source.channel.sink的名称 access.sources = r1 access ...

  3. 【LA3487】最小割-经典模型 两种方法

    题目链接 题意:A.B两个公司要买一些资源(他们自己买的资源不会重复),一个资源只能卖给一个公司.问最大收益. simple input 部分: 54 1 //买到1就给54元 15 2 33 3 2 ...

  4. [ CodeVS冲杯之路 ] P2456

    不充钱,你怎么AC? 题目:http://codevs.cn/problem/2456/ 用贪心的思想,木材当然要尽量分成多的木板,而大的木材能够分成大木板,但是小的木材不一定能够分成大的木板,所以木 ...

  5. python3,循环,方法练习2

    1:编写for循环,利用索引遍历出每一个字符 msg = 'hello egon 666' msg = 'hello egon 666' i = 0 for i in range(0, len(msg ...

  6. PHP性能追踪及分析工具xhprof的安装与使用

    对于本地开发环境来说,进行性能分析xdebug是够用了,但如果是线上环境的话,xdebug消耗较大,配置也不够灵活,因此线上环境建议使用xhprof进行PHP性能追踪及分析. 我们今天就简单介绍一下x ...

  7. selenium与360极速浏览器driver配置

    1)下载浏览器对应的driver,浏览器版本与driver对应关系,网址:http://www.cnblogs.com/JHblogs/p/7699951.html:driver下载地址:http:/ ...

  8. pytest学习(1)

    pytest是python的一个测试框架,主要是用来进行一些小的测试. 在pycharm中,缺省用的是unittest,这里说明如何设置为pytest. 当然,第一部是安装pytest pip3 in ...

  9. .NET Core CLI

    NET Core 命令 一. 帮助命令 dotnet help 使用情况: dotnet [sdk-options] [command] [command-options] [arguments] 执 ...

  10. python 执行顺序

    从上往下顺序执行,定义的方法和类要写在调用之前, 如果有 if __name__ == '__main__'   改方法所在的文件作为启动文件时会被调用,如果作为模块被调用时不会被执行.