web基于浏览器的本地存储方法应用


Posted in Javascript onNovember 27, 2012

在客户端存储数据时,我们一般都用cookie(不敏感数据),但是在客户端越来越富的今天,cookie可存储的量(每个域最大4k)实在是小。
在HTML5中有localStorage可使用,但是这就抛弃了IE8-。为了兼容,我们可以翻出IE很久以前就搞的一个存储方法:
给一个元素添加一个特殊的样式url(#default#userData),之后就可以通过setAttribute和getAttribute来存取键值对形式的数据了。
要注意的一点就是在数据改变后要使用save方法,而数据加载初期要load。
接下来就贴上使用方法,当使用的浏览器支持HTML5时,就使用localStorage。

var localStorage = (function(db) { 
if (typeof db.clear == "function") { 
return db; 
} 
var database = document.createElement("div") 
database.id = "database"; 
database.style.behavior = "url(#default#userData)"; 
document.body.appendChild(database); 
database.load("DataStore"); 
return { 
setItem: function(key, val) { 
database.setAttribute(key, val); 
database.save("DataStore"); 
} 
, getItem: function(key) { 
return database.getAttribute(key); 
} 
, removeItem: function(key) { 
database.removeAttribute(key); 
database.save("DataStore"); 
} 
}; 
} (localStorage || {}));

不过就算兼容了 还是会有问题存在,例如在IE上存储的信息,通过Chrome打开时就获取不到了。
Javascript 相关文章推荐
JavaScript CSS 修改学习第四章 透明度设置
Feb 19 Javascript
制作高质量的JQuery Plugin 插件的方法
Apr 20 Javascript
Jquery 选中表格一列并对表格排序实现原理
Dec 15 Javascript
Angularjs中的事件广播 —全面解析$broadcast,$emit,$on
May 17 Javascript
JavaScript中的boolean布尔值使用学习及相关技巧讲解
May 26 Javascript
javascript入门之string对象【新手必看】
Nov 22 Javascript
JS如何生成一个不重复的ID的函数
Dec 25 Javascript
JavaScript满天星导航栏实现方法
Mar 08 Javascript
JS实现百度网盘任意文件强制下载功能
Aug 31 Javascript
vue element-ui table组件动态生成表头和数据并修改单元格格式 父子组件通信
Aug 15 Javascript
vue 二维码长按保存和复制内容操作
Sep 22 Javascript
Vue——前端生成二维码的示例
Dec 19 Vue.js
extjs 04_grid 单击事件新发现
Nov 27 #Javascript
javascript 正则表达式相关应介绍
Nov 27 #Javascript
javascript 二进制运算技巧解析
Nov 27 #Javascript
JavaScript prototype属性深入介绍
Nov 27 #Javascript
Knockoutjs的环境搭建教程
Nov 26 #Javascript
jquery ajax请求实例深入解析
Nov 26 #Javascript
jquery validate poshytip 自定义样式
Nov 26 #Javascript
You might like
PHP新手上路(二)
2006/10/09 PHP
php按百分比生成缩略图的代码分享
2014/05/10 PHP
浅谈PHP值mysql操作类
2016/06/29 PHP
mysql查找删除重复数据并只保留一条实例详解
2016/09/24 PHP
用js实现控制内容的向上向下滚动效果
2007/06/26 Javascript
jquery1.4后 jqDrag 拖动 不可用
2010/02/06 Javascript
JQuery 拾色器插件发布-jquery.icolor.js
2010/10/20 Javascript
探讨JavaScript中声明全局变量三种方式的异同
2013/12/03 Javascript
JS简单实现动画弹出层效果
2015/05/05 Javascript
js如何判断访问是来自搜索引擎(蜘蛛人)还是直接访问
2015/09/14 Javascript
jQuery属性选择器用法示例
2016/09/09 Javascript
Vue入门之animate过渡动画效果
2018/04/08 Javascript
JavaScript中关于base64的一些事
2019/05/06 Javascript
Angular8路由守卫原理和使用方法
2019/08/29 Javascript
vue.js 实现a标签href里添加参数
2019/11/12 Javascript
解决三元运算符 报错“SyntaxError: can''t assign to conditional expression”
2020/02/12 Javascript
vue实现用户长时间不操作自动退出登录功能的实现代码
2020/07/23 Javascript
[54:25]Ti4 循环赛第三日LGD vs MOUZ
2014/07/12 DOTA
[01:05:32]DOTA2上海特级锦标赛主赛事日 - 3 败者组第三轮#1COL VS Alliance第一局
2016/03/04 DOTA
python去除空格和换行符的实现方法(推荐)
2017/01/04 Python
Python3中类、模块、错误与异常、文件的简易教程
2017/11/20 Python
Pandas 数据框增、删、改、查、去重、抽样基本操作方法
2018/04/12 Python
Python合并同一个文件夹下所有PDF文件的方法
2019/03/11 Python
如何运行.ipynb文件的图文讲解
2019/06/27 Python
Anconda环境下Vscode安装Python的方法详解
2020/03/29 Python
物流专业大学生职业生涯规划书范文
2014/01/15 职场文书
舞蹈比赛获奖感言
2014/02/04 职场文书
电子信息专业自荐书
2014/02/04 职场文书
《太阳》教学反思
2014/02/21 职场文书
前处理组长岗位职责
2014/03/01 职场文书
2014广电局实施党的群众路线教育实践活动方案思想汇报
2014/09/22 职场文书
农民工工资承诺书大全
2015/05/04 职场文书
升学宴家长答谢词
2015/09/29 职场文书
解决golang在import自己的包报错的问题
2021/04/29 Golang
一篇文章看懂MySQL主从复制与读写分离
2021/11/07 MySQL
在NumPy中深拷贝和浅拷贝相关操作的定义和背后的原理
2022/04/14 Python