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 相关文章推荐
加载远程图片时,经常因为缓存而得不到更新的解决方法(分享)
Jun 26 Javascript
为指定的元素添加遮罩层的示例代码
Jan 15 Javascript
JavaScript获取XML数据附示例截图
Mar 05 Javascript
在JavaScript中判断整型的N种方法示例介绍
Jun 18 Javascript
jQuery中:reset选择器用法实例
Jan 04 Javascript
xmlplus组件设计系列之下拉刷新(PullRefresh)(6)
May 03 Javascript
使用vue制作FullPage页面滚动效果
Aug 21 Javascript
用Axios Element实现全局的请求loading的方法
Mar 15 Javascript
node学习笔记之读写文件与开启第一个web服务器操作示例
May 29 Javascript
了解JavaScript中let语句
May 30 Javascript
js实现上传图片并显示图片名称
Dec 18 Javascript
Electron整合React使用搭建开发环境的步骤详解
Jun 07 Javascript
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
一些操作和快捷键的理解和讨论
2020/03/04 星际争霸
php一些公用函数的集合
2008/03/27 PHP
以实例全面讲解PHP中多进程编程的相关函数的使用
2015/08/18 PHP
php去除二维数组的重复项方法
2015/11/03 PHP
Smarty简单生成表单元素的方法示例
2016/05/23 PHP
游戏人文件夹程序 ver 4.03
2006/07/14 Javascript
JQuery中对服务器控件 DropdownList, RadioButtonList, CheckboxList的操作总结
2011/06/28 Javascript
JavaScript字符串对象substring方法入门实例(用于截取字符串)
2014/10/17 Javascript
jQuery中:submit选择器用法实例
2015/01/03 Javascript
JavaScript中for循环的使用详解
2015/06/03 Javascript
jquery trigger实现联动的方法
2016/02/29 Javascript
Vue.js每天必学之Class与样式绑定
2016/09/05 Javascript
Web前端开发之水印、图片验证码
2016/11/27 Javascript
微信小程序图表插件(wx-charts)实例代码
2017/01/17 Javascript
JS中使用new Option()实现时间联动效果
2018/12/10 Javascript
layuiAdmin循环遍历展示商品图片列表的方法
2019/09/16 Javascript
Vue项目页面跳转时浏览器窗口上方显示进度条功能
2020/03/26 Javascript
[02:36]DOTA2亚洲邀请赛小组赛精彩集锦:奇迹哥卡尔秀翻全场
2017/03/28 DOTA
Python编程实现微信企业号文本消息推送功能示例
2017/08/21 Python
Python随机生成均匀分布在三角形内或者任意多边形内的点
2017/12/14 Python
python检索特定内容的文本文件实例
2018/06/05 Python
django框架创建应用操作示例
2019/09/26 Python
Pytorch的mean和std调查实例
2020/01/02 Python
Python tornado上传文件的功能
2020/03/26 Python
澳大利亚第一的设计师礼服租赁网站:GlamCorner
2017/08/13 全球购物
世界上第一个水枕头:Mediflow
2018/12/06 全球购物
Calphalon美国官网:美国顶级锅具品牌
2020/02/05 全球购物
学生学习总结的自我评价
2013/10/22 职场文书
11月升旗仪式讲话稿
2014/02/15 职场文书
领导班子对照检查材料
2014/09/22 职场文书
论文评审意见
2015/06/05 职场文书
大学校园招聘会感想
2015/08/10 职场文书
初中班长竞选稿
2015/11/20 职场文书
关于做家务的心得体会
2016/01/23 职场文书
Python使用永中文档转换服务
2022/05/06 Python
了解MySQL查询语句执行过程(5大组件)
2022/08/14 MySQL