本文是有借鉴网上前辈们写过的,以及自己添加和修改了一些方法。我在chrome,firefox,ie8,ie9和ie10兼容模式测试下均可正常运行,放在这里给需要的人用吧。
这里先简单介绍下localstorage和userdata.
localstorage是html5特性,支持本地存储容量很大,而userdata是ie家的。虽然从ie8就开始支持localstorage了,但是需要html在服务器端,如果是本地的话ie是不支持的。而以下代码是可以在离线情况下进行本地存储的,主要的思路是我将localstorage和userdata都封装成同样的方法接口,判断浏览器类型进而使用不同的特性实现同样的接口。这样做的好处就是,操作的方法不会随浏览器改变而再写一遍。其实也挺简单的。
<html> <head> <script type="text/javascript"> var Sys = {}; var ua = navigator.userAgent.toLowerCase(); var s; (s = ua.match(/msie ([\d.]+)/)) ? Sys.ie = s[1] : (s = ua.match(/firefox\/([\d.]+)/)) ? Sys.firefox = s[1] : (s = ua.match(/chrome\/([\d.]+)/)) ? Sys.chrome = s[1] : //以下进行测试 if (Sys.firefox) { var local = { setItem:function(nam,val) { window.localStorage.setItem(nam,val); }, getItem:function(nam) { return window.localStorage.getItem(nam); }, removeItem:function(nam) { window.localStorage.removeItem(nam); }, clear:function() { window.localStorage.clear(); }, length:function() { window.localStorage.length(); }, key:function(i) { window.localStorage.key(i); } } document.write('Firefox: ' + Sys.firefox); } if (Sys.ie) { var box = document.body || document.getElementsByTagName("head")[0] || document.documentElement; UserData_obj = document.createElement('input'); UserData_obj.type = "hidden"; UserData_obj.addBehavior ("#default#userData"); box.appendChild(UserData_obj); //设定对象 var local= { setItem:function(nam,val) { UserData_obj.load(nam); UserData_obj.setAttribute(nam,val); var d= new Date(); d.setDate(d.getDate()+700); UserData_obj.expires=d.toUTCString(); UserData_obj.save(nam); UserData_obj.load("local_userdata"); var dt=UserData_obj.getAttribute("local_userdata"); if(dt==null)dt=''; var reg=new RegExp(nam); //判断nam名字是否存在,不存在添加进去 if(!reg.test(dt)){ dt=dt+nam+","; } UserData_obj.setAttribute("local_userdata",dt); UserData_obj.save("local_userdata"); }, //模拟 setItem getItem:function(nam) { UserData_obj.load(nam); return UserData_obj.getAttribute(nam); }, //模拟 getItem removeItem:function(nam) { UserData_obj.load(nam); clear_userdata(nam); UserData_obj.load("local_userdata"); var dt=UserData_obj.getAttribute("local_userdata"); var reg=new RegExp(nam+",","g"); dt=dt.replace(reg,''); var d= new Date(); d.setDate(d.getDate()+700); UserData_obj.expires= d.toUTCString(); UserData_obj.setAttribute("local_userdata",dt); UserData_obj.save("local_userdata"); }, //模拟 removeItem clear:function() { UserData_obj.load("local_userdata"); var dts=UserData_obj.getAttribute("local_userdata").split(","); for (var i in dts) { if(dts[i]!='') { UserData_obj.load(dts[i]); UserData_obj.removeAttribute(dts[i]); clear_userdata(dts[i]); } } UserData_obj.load("local_userdata"); UserData_obj.removeAttribute("local_userdata"); clear_userdata("local_userdata") }, //模拟 clear(); clear2:function() { UserData_obj.load("local_userdata"); var dts=UserData_obj.getAttribute("local_userdata").split(","); for (var i in dts) { if(dts[i]!='') { UserData_obj.load(dts[i]); UserData_obj.removeAttribute(dts[i]); clear_userdata(dts[i]); } } clear_userdata("local_userdata"); }, each:function() { UserData_obj.load("local_userdata"); var dts=UserData_obj.getAttribute("local_userdata").split(","); for(var i in dts){ alert(dts[i]); } return dts; } } function clear_userdata(keyname)//将名字为keyname的变量消除 { var keyname; var d= new Date(); d.setDate(d.getDate()-1); UserData_obj.load(keyname); UserData_obj.expires=d.toUTCString(); UserData_obj.save(keyname); } document.write('IE: ' + Sys.ie); } if (Sys.chrome){ local = { setItem:function(nam,val) { window.localStorage.setItem(nam,val); }, getItem:function(nam) { return window.localStorage.getItem(nam); }, removeItem:function(nam) { window.localStorage.removeItem(nam); }, clear:function() { window.clear(); }, length:function() { window.localStorage.length(); }, key:function(i) { window.localStorage.key(i); } } document.write('chrome: ' + Sys.chrome); } </script> </head> <body> <script type="text/javascript"> window.local.setItem("name_new1","1liangli") var name1 = window.local.getItem("name_new1"); document.write(name1); document.write("</br>"); </script> </body> </html>参考地址: http://www.cnblogs.com/xiaowei0705/archive/2011/04/19/2021372.html
http://www.cnblogs.com/yuzhongwusan/archive/2011/12/19/2293347.html