HTML5开发学习（2）:本地存储之localStorage 、sessionStorage、globalStorage

原文: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

标签: html5, web sql database, 本地存储, localStorage, sessionStorage, globalStorage