![]() |
跨浏览器的本地存储(二):DOM:Storage |
DOM Storage,是基于 Web Applications 1.0 specification 中介绍的 Structured client-side storage。相比 Cookies 来说,DOM Stroage 空间更大、更安全、更易于使用的。目前它只在基于Moziila的浏览器中可以使用,从 Firefox2 开始。 一、DOM:Storage: sessionStorage 浏览器支持:Firefox 2.0+ 基本语法: // 设置 key 值 sessionStorage.key = value; // 获取 key 值 value = sessionStorage.key; 备注: 作为每个 window 对象的属性存在的全局对象,即:可以通过 sessionStorage 或者 window.sessionStorage 来访问它们。 sessionStorage 含有一个在页面会话有效期内(只要页面没有关闭,一个页面会话就始终保持着,且当页面被重新载入或恢复时“复活”,而打开一个新的标签页或新窗口都会初始化新的会话)可用的存储区域。 sessionStorage 持有那些应该保存的临时数据,一旦浏览器突然被刷新时,可恢复。 sessionStorage 暂时还没有实现在浏览器崩溃后存储和恢复数据的功能( bug 339445 )。 更多信息:sessionStorage specification 样例:自动保存文本字段的内容,如果浏览器突然被刷新,就恢复字段内容,这样就不会丢失任何输入了。 // 获得我们要跟踪的那个文本字段 var field = document.getElementById("field"); // 看看我们是否有一个autosave的值 // (这将只会在页面被突然刷新时发生) if ( sessionStorage.autosave ) { // 恢复文本字段中的内容 field.value = sessionStorage.autosave; } // 每秒钟检查一次文本字段的内容 setInterval(function(){ // 并把结果保存到会话存储对象中 sessionStorage.autosave = field.value; }, 1000);二、DOM:Storage: globalStorage(重点) 浏览器支持:Firefox 2.0+ 基本语法: 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; 备注: 作为每个 window 对象的属性存在的全局对象,即:可以通过 globalStorage 或者 window.globalStorage 来访问它们。 Storage 空间:整个域名的默认 Storage 大小为 5MB (不过 Storage 区域的大小用户可以自定义),globalStorage['net'] 为 2MB,globalStorage['planabc.net'] 为 3MB,如果超过限制,则会报错。 Firefox 支持 Storage 事件:document.addEventListener(”storage”, eventHandler, false);。 Firefox 目前还没有实现 globalStorage[tld] 和 globalStorage[''] (会抛出一个安全错误),这是由于对于这些名字空间可以进行随意读写的话是有安全漏洞的。 Firefox 2 允许访问比当前文档域名层次高的存储的对象,由于安全的因素 Firefox 3 中不再允许。 更多信息:globalStorage specification 样例:(DOM Storage Test) // 跟踪一个用户在你的域名下所访问的所有页面的次数 globalStorage['mozilla.org'].visits = parseInt( globalStorage['mozilla.org'].visits || 0 ) + 1; |