Web Storage 两个目标
  提供一种在cookie之外的存储会话守数据的途径
  提供一种存储大量可以跨会话存在的数据机制

最初的Web Storage规范包含两个对象
  sessionStorage 和 globalStorage
    都以window的属性存在
    IE8+ chrome4+

Storage 类型
  提供了最大的存储空间(因浏览器而异)来存储名值对
  方法
    clear() 删除所有值 Firefox中没有实现
    getItem(key) 根据指定的名字key获取对应的值
    key(index) 获取index位置的 key(值的名字)
    removeItem(key) 删除由key指定的名值对
    setItem(key,value) 为指定的那么设置一个对应的值

sessionStorage 对象
  sessionStorage 对象存储特定于某个会话的数据 也就是说数据只保持到浏览器关闭(cookie未设置实效时间性质一样)
  写入数据方面
    Firefox WebKit 同步写入 立即提交
    IE 异步写入
    只使用于IE8 可以强制把数据写入磁盘 对于大数据量 可能要考虑这种事务形式的方法
    sessionStorage.begin() //begin方法是为了确保在这段代码执行的时候不发生其他磁盘写入操作
    sessionStorage.name='lxk';
    sessionStorage.age='16';
    sessionStorage.commit();//调用commit方法之后立刻被写入磁盘
方法
  有length属性
  读取
    sessionStorage.getItem(key)
    sessionStorage.key
  删除
    delete sessionStorage.key 在webkit中无效
    sessionStorage.removeItem(key)
  迭代
    for(var key in sessionStorage){
      console.log(key + "=" + sessionStorage.getItem(key))
    }
    for(var i = 0, len = sessionStorage.length; i < len; i++){
      var key = sessionStorage.length.key[i];
      var value = sessionStorage.getItem(key);
      console.log(key + "=" + value)
    }

globalStorage 对象
  Firefox2中实现了此对象
  需要设置哪些域可以访问
  使用方法
    globalStorage[".wrox.com"].name = "lxk";//对于所有的子域都可以访问
    var name = globalStorage[".wrox.com"].name
  对globalStorage访问是依据发起的请求页面的域名 协议 和端口来限制的 类似同源策略
    https 和 http (:80和:8080) (a.wrox.com 和 b.wrox.com)下设置都不能互相访问
  域名使用location.host 靠谱一点
  如果不使用removeItem 或者 delete 删除 或者 浏览器清理缓存 存储的数据一直保留在磁盘上

localStorage 对象
  不同于 globalStorage localStorage规则定好了,如果想访问到localStorage对象,页面必须来自
    同一域名 同一协议 同一端口
  方法同上
  如果不使用removeItem 或者 delete 删除 或者 浏览器清理缓存 存储的数据一直保留在磁盘上

Storage 事件
  对Storage对象进行的任何修改都会在文档上触发Storage事件 例如 setItem delete removeItem clear
  属性
    domain 发生变化的存储空间域名
    key 设置或删除的键
    newValue 设置值 是新值 删除值 为null
    oldValue 键被更改之前的值
  例子 chrome不支持
    document.addEventListener("storage", function(event){
      cosnole.log(event.domain)
    }, false)

限制
  存储空间的限制 来自每个源 (协议 域 端口)
  localStorage 大部分 5M chrome 和 safari 对每个源 限制是 2M ios safari 和 android webkit 2.5M

注意:
  Storage类型只能存储字符串 非字符串数据在存储之前会被转换成字符串
  sessionStorage localStroage globalStorage 都是Stroage的实例
  例子
    var obj = {name: "lxk"};
    sessionStorage.setItem("info", obj);//应该用JSON.stringify(obj)做一个序列化和反序列化
    sessionStorage.getItem("info") --> "[object Object]"

  sessionStorage对象主要针对会话的小段数据存储 如果需要跨越会话存储数据 global和localStorage更为适合

  cookie 默认情况 和 sessionStorage 一样会在会话结束 消失

数据存储之Web存储(sessionStorage localStorage globalStorage )的更多相关文章

  1. HTML5中的Web Storage(sessionStorage||localStorage)理解与简单实例

    Web Storage是什么? Web Storage功能,顾名思义,就是在Web上针对client本地储存数据的功能,详细来说Web Storage分为两种: sessionStorage: 将数据 ...

  2. 客户端本地存储,web存储,localStorage

    HTML5 LocalStorage 本地存储 说到本地存储,这玩意真是历尽千辛万苦才走到HTML5这一步,之前的历史大概如下图所示: 最早的Cookies自然是大家都知道,问题主要就是太小,大概也就 ...

  3. 浏览器 Web Storage - sessionStorage & localStorage

    storage事件 当储存的数据发生变化时,会触发storage事件.我们可以指定这个事件的回调函数. window.addEventListener("storage",onSt ...

  4. 【html5】Web存储_locaStorage对象的应用

    Web存储 html5可以在本地存储用户浏览的数据,数据的存储原理是以 键/值 存储的 存储对象分类 localStorage:没有时间限制的数据存储 sessionStorage:针对一个会话的数据 ...

  5. Web存储使用详解(本地存储、会话存储)

    Web存储使用详解(本地存储.会话存储)1,Web存储介绍HTML5的Web存储功能是让网页在用户计算机上保存一些信息.Web存储又分为两种:(1)本地存储,对应 localStorage 对象.用于 ...

  6. HTML5: HTML5 Web 存储

    ylbtech-HTML5: HTML5 Web 存储 1.返回顶部 1. HTML5 Web 存储 HTML5 web 存储,一个比cookie更好的本地存储方式. 什么是 HTML5 Web 存储 ...

  7. HTML5(七)Web 存储

    HTML5 Web 存储 HTML5 web 存储,一个比cookie更好的本地存储方式. 什么是 HTML5 Web 存储? 使用HTML5可以在本地存储用户的浏览数据. 早些时候,本地存储使用的是 ...

  8. (转)HTML5开发学习(2):本地存储之localStorage 、sessionStorage、globalStorage

    原文:http://www.cnblogs.com/xumingxiang/archive/2012/03/25/2416386.html HTML5开发学习(2):本地存储之localStorage ...

  9. web存储机制(localStorage和sessionStorage)

    web存储包括两种:sessionStorage 和 localStorage(都是限定在文档源级别,非同源文档间无法共享) 1.sessionStorage 数据放在服务器上(IE不支持) 严格用于 ...

随机推荐

  1. hadoop+hive+spark搭建(一)

    1.准备三台虚拟机 2.hadoop+hive+spark+java软件包 传送门:Hadoop官网 Hive官网 Spark官网      一.修改主机名,hosts文件 主机名修改 hostnam ...

  2. 小白的Python之路 day5 shelve模块讲解

    shelve模块讲解 一.概述 之前我们说不管是json也好,还是pickle也好,在python3中只能dump一次和load一次,有什么方法可以向dump多少次就dump多少次,并且load不会出 ...

  3. c语言贪吃蛇详解5.GameOver功能与显示成绩

    c语言贪吃蛇详解5.GameOver功能与显示成绩 以前我们已经做出来了一个能吃东西变长的蛇.不过它好像不会死... 现在就来实现一下game over的功能吧. 写个函数判断蛇是否撞到自己或者撞到墙 ...

  4. 设计一个有getMin功能的栈(2)

    题目: 实现一个特殊的栈,在实现栈的基本功能的基础上,再实现返回栈中最小元素的操作. 要求: 1.pop.push.getMin操作的时间复杂度都是O(1) 2.设计的栈类型可以输用现成的栈结构 解答 ...

  5. COM学习(四)——COM中的数据类型

    上一次说到,COM为了跨语言,有一套完整的规则,只要COM组件按照规则编写,而不同的语言也按照对应的规则调用,那么就可以实现不同语言间相互调用.但是根据那套规则,只能识别接口,并调用没有参数和返回类型 ...

  6. CentOS7配置静态IP

    确保是在root用户下进行操作,首先进入network-scripts目录 cd /etc/sysconfig/network-scripts/ 通过ls列出该目录下的所有文件,其中"ifc ...

  7. Redis的key过期处理策略

    Redis中有三种处理策略:定时删除.惰性删除和定期删除. 定时删除:在设置键的过期时间的时候创建一个定时器,当过期时间到的时候立马执行删除操作.不过这种处理方式是即时的,不管这个时间内有多少过期键, ...

  8. 谈谈promise

    最近在看<你不知道的javascript中卷>,发觉作者花了基本一半的篇幅去讲异步和promise,觉得有必要总结一下. 其实本文的目的是想手写一个Promise的,无奈总结着总结着发觉篇 ...

  9. 【干货分享】dos命令大全

    一般来说dos命令都是在dos程序中进行的,如果电脑中安装有dos程序可以从开机选项中选择进入,在windows 系统中我们还可以从开始运行中输入cmd命令进入操作系统中的dos命令,如下图: 严格的 ...

  10. 【Java学习笔记之二】java标识符命名规范

    什么是标识符 就是程序员在定义java程序时,自定义的一些名字.标识符可以应用在类名.变量.函数名.包名上. 标识符必须遵循以下规则 标识符由26个英文字符大小写(a~zA~Z).数字(0~9).下划 ...