客户端存储遵循同源策略,不同的站点页面之间不可以相互读取对方的数据,但同一站点的不同页面之间可以共享存储的数据

客户端存储的种类:

1、web存储

  localStorage、sessionStorage

2、cookie

3、userData(IE)

4、web数据库(尚未标准化)

  索引数据库API(indexed Database API)

5、文件系统API

  用于将文件通过XHR上传到服务器

主要看了localStorage和sessionStorage

区别:

  1、存储的有效期。localStorage为永久存储,除非用户手动删除;sessionStorage为会话存储,页面关闭之后就消失。

  2、作用域:localStorage限定在文件源的级别,只要是同源的页面,都可以共享数据;sessionStorage只能再窗口级别共享数据(窗口为顶级窗口,顶级窗口和子窗口之间可以共享sessionStorage的数据)。

API:

  setItem(“x”, 1)// 设置

  getItem(“x”)// 获取

  remoItem(“x”)// 删除

  clear()// 删除全部

  key(i) // 获取第i个数据的key

存储事件:

  使用localStorage存储数据时,在当前页面存储,会在其他同源页面中触发存储事件(只有存储数据真正发生变化时才会被触发)

  注册存储事件可以使用addEventListener或attachEvent的方法(绝大多数浏览器还可以使用onstorage的方法,但firefox不支持)

事件对象:(IE8不支持)

  key // 被设置或移除的项的键,如果是调用的clear,则该值为null

  newValue // 保存该项的新值,如果是删除,则该值为null

  oldValue // 改变之前的值,如果是新项,则该值为null

  storageArea // localStorage、sessionStorage等

  url // 触发该存储事件的文档url

原生js--客户端存储的种类的更多相关文章

  1. 原生js发送ajax请求

    堕落了一阵子了,今天打开博客,发现连登录的用户名和密码都不记得了.2016年已过半,不能再这么晃荡下去了. 参加了网易微专业-前端攻城狮 培训,目前进行到大作业开发阶段,感觉举步维艰.但是无论如何,不 ...

  2. 【面试篇】寒冬求职季之你必须要懂的原生JS(中)

    互联网寒冬之际,各大公司都缩减了HC,甚至是采取了“裁员”措施,在这样的大环境之下,想要获得一份更好的工作,必然需要付出更多的努力. 一年前,也许你搞清楚闭包,this,原型链,就能获得认可.但是现在 ...

  3. 前端跨域问题相关知识详解(原生js和jquery两种方法实现jsonp跨域)

    1.同源策略 同源策略(Same origin policy),它是由Netscape提出的一个著名的安全策略.同源策略是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正 ...

  4. 使用原生JS+CSS或HTML5实现简单的进度条和滑动条效果(精问)

    使用原生JS+CSS或HTML5实现简单的进度条和滑动条效果(精问) 一.总结 一句话总结:进度条动画效果用animation,自动效果用setIntelval 二.使用原生JS+CSS或HTML5实 ...

  5. 原生JS封装Ajax插件(同域&&jsonp跨域)

    抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正 ...

  6. 原生JS实现全屏切换以及导航栏滑动隐藏及显示——重构前

    思路分析: 向后滚动鼠标滚轮,页面向下全屏切换:向前滚动滚轮,页面向上全屏切换.切换过程为动画效果. 第一屏时,导航栏固定在页面顶部,切换到第二屏时,导航条向左滑动隐藏.切换回第一屏时,导航栏向右滑动 ...

  7. 原生JS 表单提交验证器

    转载:http://www.cnblogs.com/sicd/p/4613628.html 一.前言 最近在开发一个新项目,需要做登陆等一系列的表单提交页面.在经过“缜密”的讨论后,我们决定 不用外部 ...

  8. JavaScript的客户端存储

    一.前言: 客户端存储实际上就是Web浏览器的记忆功能,通过浏览器的API实现数据存储到硬盘: 二.存储的不同形式: 1.Web存储:localStorage 和 sessionStorage 代表同 ...

  9. js023-离线应用与客户端存储

    js023-离线应用与客户端存储 本章内容: 进行离线检测 使用离线缓存 在浏览器中保存数据 23.1 离线检测 第一步:知道设备是在线还是离线:navigator.Online属性.该值为true表 ...

随机推荐

  1. (弃) Keystone CLI_选项与子命令概况

    本文档介绍icehouse发行版keystone命令 keystone Command-Line Interface (CLI)提供用于和keystone服务器交互的方便工具,但是该命令行工具逐渐受到 ...

  2. perl 读取json 格式的文件

    使用JSON 模块中的 decode_json 函数,将json文件中的数据解码为perl 中的对象,然后进行处理 代码如下: #!/usr/bin/env perl use JSON; use En ...

  3. Git介绍及安装配置

    一.概述 1.1git概念 Git是一个开源的分布式版本控制系统,用于敏捷高效处理任意规模的项目,其作者为Linux创造者Linus Torvalds为管理Linux内核而开放的一个开源的版本控制柔软 ...

  4. OpenGL 遮挡查询

    原文地址:http://www.linuxidc.com/Linux/2015-02/114036.htm 在一个场景中,如果有有些物体被其他物体遮住了不可见.那么我们就不需要绘制它.在复杂的场景中, ...

  5. Windows 7运行命令大全

    Windows 7运行命令大全,小编整理了常用的45个Win7运行命令分享给大家:1.cleanmgr:打开磁盘清理工具 2.compmgmt.msc:计算机管理 3.conf:启动系统配置实用程序 ...

  6. php解析mpp文件中的前置任务

    获取层级的project任务  参考 启动javabridge java -jar JavaBridge.jar SERVLET_LOCAL:8089 1.读取mpp文件 $file_path = & ...

  7. 详解BarTender选项大小调整模式

    BarTender大小调整模式是DotCode码制独有的符号体系特殊选项.DotCode 符号可能在形状上有所不同,包括从接近正方形的点阵到细长的色带,而“大小调整模式”选项通过指定点阵的配置来确定 ...

  8. multiselect2side:jQuery多选列表框插件

    http://blog.csdn.net/rosanu_blog/article/details/8550723 http://www.bkjia.com/jQuery/449193.html < ...

  9. 【linux】 linux 禁止ping

    linux 禁止 ping 一.修改内核参数 1.临时允许PING操作的命令为:echo 0 >/proc/sys/net/ipv4/icmp_echo_ignore_all 2.永久允许PIN ...

  10. SQLServer------备份与还原

    转载: http://www.cnblogs.com/zgqys1980/archive/2012/07/04/2576382.html