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

在客户端存储数据时,我们一般都用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打开时就获取不到了。

时间: 2024-10-07 13:20:38

web基于浏览器的本地存储方法应用_javascript技巧的相关文章

Java Web基于Session的登录实现方法_java

本文实例讲述了Java Web基于Session的登录实现方法.分享给大家供大家参考,具体如下: package cn.com.login; import java.io.IOException; import java.io.PrintWriter; import java.util.ArrayList; import java.util.List; import javax.servlet.ServletException; import javax.servlet.http.HttpSer

JS区分浏览器页面是刷新还是关闭_javascript技巧

Web开发者在系统开发中经常要面对产品经理各式各样的需求,当然,大部分对产品体验还是有帮助的,例如我们今天提到的刷新页面,前进后退,关闭浏览器标签时,为了避免用户误操作,需给出二次确认提示框,这个相信大家都非常熟悉了,采用浏览器提供的BOM事件机制就可以解决,使用window对象的onbeforeunload事件即可,如果产品经理只提出这样的需求,那确实无可厚非,然而其需要的不仅仅是这些... 例如,我们一次项目开发中,产品经理就针对我们的实现提出了"改进方案": 你们这弹出框太丑了,

跨浏览器的本地存储 Ⅰ

原文:http://www.planabc.net/2008/08/05/userdata_behavior/ 现在最流行的本地存储莫过于 cookie 的应用,但 浏览器对cookie有很多限制 ,最大的限制在于其对cookie 总大小,仅为 4K 左右(包括名(name).值(value)和等号). 对于复杂一点的应用和需求,仅有的 4K 大小还是有点相形见绌,其实很多浏览器(IE.Firefox.Safari)本身也提供了自己的本地存储的功能,或许在特定的环境下能满足我们. 一.userD

asp.net基于Web Service实现远程上传图片的方法_实用技巧

本文实例讲述了asp.net基于Web Service实现远程上传图片的方法.分享给大家供大家参考,具体如下: 页面调用代码: 前提添加Web 引用 HttpFileCollection files = HttpContext.Current.Request.Files; string filePath = files[0].FileName; string fileName = filePath.Substring(filePath.LastIndexOf("//") + 1); b

js 获取本地文件及目录的方法(推荐)_javascript技巧

Javascript是网页制作中离不开的脚本语言,依靠它,一个网页的内容才生动活泼.富有朝气.但也许你还没有发现并应用它的一些更高级的功能吧?比如,对文件和文件夹进行读.写和删除,就象在VB.VC等高级语言中经常做的工作一样.怎么样,你是否需要了解这方面的知识?那就请跟我来,本文将详细描述如何使用Javascript语言进行文件操作. 一.功能实现核心:FileSystemObject 对象 其实,要在Javascript中实现文件操作功能,主要就是依靠FileSystemobject对象.在详

PHP基于GD库的图像处理方法小结_php技巧

本文实例讲述了PHP基于GD库的图像处理方法.分享给大家供大家参考,具体如下: gd图像处理技术 extension=php_gd2.dll 创建画布 画布,一种资源型数据,可操作的图像资源 创建画布(新建) imageCreate(width,height) //创建基于调色板的画布 imageCreateTrueColor(width,height) //创建真彩色的画布 基于图片创建画布(打开) imageCreateFromJPEG( url) imageCreateFromPNG(ur

php获取远程图片并下载保存到本地的方法分析_php技巧

本文实例讲述了php获取远程图片并下载保存到本地的方法.分享给大家供大家参考,具体如下: 远程图片指的是远端服务器上的数据我们可以通过php的许多函数来读取下载了,这里整理了两个可以自动下载远程图片并下载保存到本地的例子. 例1,可以自动识别图片类型然后进行对应的保存 /* *功能:php完美实现下载远程图片保存到本地 *参数:文件url,保存文件目录,保存文件名称,使用的下载方式 *当保存文件名称为空时则使用远程文件原来的名称 */ function getImage($url,$save_d

javascript实现将文件保存到本地方法汇总_javascript技巧

下面是保存一个图片为示例,代码来源于网络,希望能够给大家带来一定的帮助,代码如下: <script type="text/javascript"> function saveFile(imgUrl) { var oPop=window.open(imgUrl,"","width=1, height=1, top=5000, left=5000"); for(;oPop.document.readyState != "comp

asp.net基于session实现购物车的方法_实用技巧

本文实例讲述了asp.net基于session实现购物车的方法.分享给大家供大家参考,具体如下: //加入购物车 protected void LinkButton2_Click(object sender, EventArgs e) { DataTable dt = null; //用户购买商品 如果 没有登录 则提示登录 if (Session["userName"] == null) { Common.MessageBox.ShowAndRedirectTo(this.Page,