原文:http://www.cnblogs.com/xumingxiang/archive/2012/03/25/2416386.html

HTML5开发学习(2):本地存储之localStorage 、sessionStorage、globalStorage   Posted on 2012-03-25 11:23 祥叔 阅读(2650) 评论(0)  编辑 收藏

HTML5 提供了四种在客户端存储数据的新方法,即 localStorage 、sessionStorage、globalStorage、Web Sql Database。 本文先介绍前面三个,这三个相对比较简单,理解和操作都比较容易,下一节重点介绍Web Sql Database :

一,localStorage :

localStorage 没有时间限制的数据存储,第二天、第二周或下一年之后,数据依然可用。也就是说,localStorage是永远不会过期的,除非主动删除数据。数据可跨越多个窗口,无视当前会话,被共同访问、使用。有点像AspNet  应用程序中的全局变量Application。

二,sessionStorage :

顾名思义它就如同AspNet中的Session。 针对一个 session  的数据存储,任何一个页面存储的信息在窗口中同一网站的任何页面都可以访问它存储的数据。每个窗口的值都是独立的,它的数据会因窗口的关闭而丢失,不同窗口间的sessionStorage是不可以共享的。

localStorage /sessionStorage都有相同的Api 如

localStorage.length 获得storage中的个数

localStorage .key(n) 获得storage中第n个键值对的键

localStorage.key = value

localStorage.setItem(key, value) 添加

localStorage.getItem(key)获取

localStorage.removeItem(key) 移除

localStorage.clear() 清除

从上面的Api可以看出,他们其实就是键/值对,就是字典,就是JSON。既然可以看作是json ,那么对他们的操作就可以有如下方式:

如:localStorage.name="徐明祥" ;//添加

localStorage["name"]="徐明祥" ; //添加

alert(localStorage.name);//获取

alert(localStorage["name"]);//获取

三,globalStorage:

在浏览器关闭以后,使用globalStorage存储的信息仍能够保留下来,和sessionStorage一样,域中任何一个页面存储的信息都能被所有的页面共享。目前只有FF支持,且只支持当前域下的globalStorage存储。

基本用法:

globalStorage['developer.mozilla.org'] ——  在developer.mozilla.org下面所有的子域都可以通过这个存储对象来进行读和写。

globalStorage['mozilla.org'] —— 在mozilla.org域名下面的所有网页都可以通过这个存储对象来进行读和写。

globalStorage['org'] —— 在.org域名下面的所有网页都可以通过这个存储对象来进行读和写。

globalStorage[''] —— 在任何域名下的任何网页都可以通过这个存储对象来进行读和写。

方法属性:

setItem(key, value) —— 设置或重置 key 值。

getItem(key) —— 获取 key 值。

removeItem(key) —— 删除 key 值。

设置 key 值:window.globalStorage["planabc.net"].key = value;

获取 key 值:value = window.globalStorage["planabc.net"].key;

四,Web Sql DataBase

欲知详情请看下一回:http://www.cnblogs.com/xumingxiang/archive/2012/03/25/2416418.html

原文地址:http://www.cnblogs.com/xumingxiang/archive/2012/03/25/2416386.html

作者 : 徐明祥   出处:http://www.cnblogs.com/xumingxiang  版权:本文版权归作者和博客园共有   转载:欢迎转载,为了保存作者的创作热情,请按要求【转载】,谢谢   要求:未经作者同意,必须保留此段声明;必须在文章中给出原文连接;否则必究法律责任 
 
 

(转)HTML5开发学习(2):本地存储之localStorage 、sessionStorage、globalStorage的更多相关文章

  1. H5新特性 本地存储---cookie localStorage sessionStorage

    本地存储的作用 :避免登录网站时,用户在页面浏览时重复登录,也可以实现快速登录,一段时间内保存用户的登录效果,提高页面访问速率 在html5中提供三种数据持久化操作的方法: 1.cookie 可看作是 ...

  2. 本地存储cookie,localStorage,sessionStorage

    常见的前端存储有老朋友 cookie,短暂的 sessionStorage,和简单强大的localStorage 他们之间的区别有以下几点 1.. cookie在浏览器和服务器间来回传递.而sessi ...

  3. html5本地存储(localStorage)使用介绍

    1.html5几种存储形式 本地存储(localStorage && sessionStorage) 离线缓存(application cache) indexedDB 和 webSQ ...

  4. (转)HTML5开发学习(3):本地存储之Web Sql Database

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

  5. html5本地存储之localstorage 、本地数据库、sessionStorage简单使用示例

    这篇文章主要介绍了html5本地存储的localstorage .本地数据库.sessionStorage简单使用示例,需要的朋友可以参考下 html5的一个非常cool的功能,就是web stora ...

  6. html5开发学习 html5自学需要怎么学

    记得很多大鳄都说过一句话:只要站在风口上,猪都能飞起来.而对于如今的IT技术领域来说,无疑这只幸运的"猪"非html5莫属.html5开发技术在16年迎来了一个飞跃的发展,这也让很 ...

  7. store.js - 轻松实现本地存储(LocalStorage)

    store.js 是一个兼容所有浏览器的 LocalStorage 包装器,不需要借助 Cookie 或者 Flash.store.js 会根据浏览器自动选择使用 localStorage.globa ...

  8. web 本地存储 (localStorage、sessionStorage)

    web 本地存储 (localStorage.sessionStorage,cookie) localStorage(长期储存):即使关闭浏览器数据也不会删除,除非使用localStorage.cle ...

  9. [web 前端] web本地存储(localStorage、sessionStorage)

    cp from : https://blog.csdn.net/mjzhang1993/article/details/70820868 web 本地存储 (localStorage.sessionS ...

随机推荐

  1. Peer Code Reviews Made Easy with Eclipse Plug-In

    欢迎关注我的社交账号: 博客园地址: http://www.cnblogs.com/jiangxinnju/p/4781259.html GitHub地址: https://github.com/ji ...

  2. 复杂TableView在iOS上的性能优化

    声明:本文翻译自<iOS performance optimization>,原文作者 Khang Vo.翻译本文纯属为了技术交流的目的,并不具有任何的商业性质,也不得利用本文内容进行商业 ...

  3. 5.4.2 使用配置启动firefox

    1.使用firefox的本地配置加载浏览器 使用本地配置加载浏览器,代码如下. 这样运行后,可以看到firebug等插件都已启动. 练习:假设做性能测试时,需要获取某个状况下的页面网络运行参数.要求完 ...

  4. chrome浏览器下页面顶部出现一条空白解决

    最近遇到页面在chrome浏览器下,顶部会出现一条空白的问题.后来知道是bom头的问题. 1.什么是bom头? BOM签名的意思就是告诉编辑器当前文件采用何种编码,方便编辑器识别,但是BOM虽然在编辑 ...

  5. think in java 读书笔记 2 —— 套接字

    目录 think in java 读书笔记 1 ——移位 think in java 读书笔记 2 —— 套接字 think in java 读书笔记 3 —— 数据报 概要 1. 套接字基本知识 2 ...

  6. Java多线程-新特性-线程池

    Sun在Java5中,对Java线程的类库做了大量的扩展,其中线程池就是Java5的新特征之一,除了线程池之外,还有很多多线程相关的内容,为多线程的编程带来了极大便利.为了编写高效稳定可靠的多线程程序 ...

  7. BZOJ1937 [Shoi2004]Mst 最小生成树

    首先由贪心的想法知道,树边只减不加,非树边只加不减,令$w_i$表示i号边原来的边权,$d_i$表示i号边的改变量 对于一条非树边$j$连接着两个点$x$.$y$,则对于$xy$这条路径上的所有树边$ ...

  8. async 和 await 以及Action Func

    C# 5.0中引入了async 和 await.这两个关键字可以让你更方便的写出异步代码. 看个例子: public class MyClass { public MyClass() { Displa ...

  9. XAML-1

    1.XAML Extension Application Marked Language,是WPF技术中专门用来设计UI的语言.XAML是从XML派生出来的,是一种声明式语言,当你看到一个标签,就是声 ...

  10. vim命令/压缩和解压命令

    gzip命令 -d 解压 -#  1 为最快 但容量问题 . 9为最好 .6为默认 gzip install.log 比较好理解,windows里面类似的,记住zip 和unzip是可以目录或者文件解 ...