storage在IE8下的兼容性写法

时间:2023-03-09 02:37:48
storage在IE8下的兼容性写法

storage 本地缓存,这是HTML5的一个非常好用的地方,具体好用在哪,网上可以找到很多,但是我觉得总结的都不是很完整,我建议大家有空的话可以看下JavaScript权威指南这本书,里面对于这个方法有着十分详细的解释。虽然说好用,但是还有个十分麻烦的问题就是在IE浏览器下的兼容性问题,IE是不支持这个属性的。也不是说全部,我自己测试的结果是IE8、9都是不支持的,那么怎么解决这个问题呢?

那就要感谢前辈了,我也不知道是谁写的这段代码,但是我用着十分好用,最起码IE8、9下都可以正常使用这个属性了。现在把代码分享给大家:

<script language="JavaScript" type="text/javascript">
if(typeof(storage)=='undefined') {var box = document.body || document.getElementsByTagName("head")[0] || document.documentElement; userdataobj = document.createElement('input'); userdataobj.type = "hidden"; userdataobj.addBehavior ("#default#userData"); box.appendChild(userdataobj); //设定对象 var storage= { setItem:function(nam,val) {userdataobj.load(nam); userdataobj.setAttribute(nam,val); var d= new Date(); d.setDate( d.getDate()+700); userdataobj.expires=d.toUTCString(); userdataobj.save(nam); userdataobj.load("userdata_record"); var dt=userdataobj.getAttribute("userdata_record"); if(dt==null)dt=''; dt=dt+nam+","; userdataobj.setAttribute("userdata_record",dt); userdataobj.save("userdata_record");}, //模拟 setItem getItem:function(nam) {userdataobj.load(nam); return userdataobj.getAttribute(nam); }, //模拟 getItem removeItem:function(nam) {userdataobj.load(nam); clear_userdata(nam) userdataobj.load("userdata_record"); var dt=userdataobj.getAttribute("userdata_record"); var reg=new RegExp(nam+",","g"); dt=dt.replace(reg,''); var d= new Date(); d.setDate( d.getDate()+700); userdataobj.expires= d.toUTCString(); userdataobj.setAttribute("userdata_record",dt); userdataobj.save("userdata_record"); }, //模拟 removeItem clear:function(){ userdataobj.load("userdata_record"); var dt=userdataobj.getAttribute("userdata_record").split(","); for (var i in dt) {if(dt[i]!='')clear_userdata(dt[i]) } clear_userdata("userdata_record") } //模拟 clear(); } function clear_userdata(keyname)//将名字为keyname的变量消除 {var keyname; var d= new Date(); d.setDate( d.getDate()-1); userdataobj.load(keyname); userdataobj.expires=d.toUTCString(); userdataobj.save(keyname); } } </script>

凡事都有个但是,虽然都说IE浏览器是万恶的浏览器,但是却也可以严格的要求我们的代码规范。

我在我的IE浏览器上面进行测试,IE8、9都是没有问题的,而在其他人的IE浏览器中却出现了问题,使我百思不得其解,如果有哪位大大知道答案的可以说下。最后花了好长时间的研究才发现用ready()方法解决了这个问题,即:

$(document).ready(function(){}

所以说要严格要求自己的代码规范。

我在写这个项目的时候还碰到一个问题,就是我写了一个很简单的toggle()方法,让其达到点击出现二级菜单,再次点击二级菜单消失的效果。但是却出现了所有的一级和二级菜单全部都消失了的问题,检查了一个小事也没有发现问题,最后发现是jQuery引入版本的问题,我换了一个版本的就好了,这是我第一次在写代码的过程中碰见这个问题,记录下来,提醒着自己。