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

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

  1. <script language="JavaScript" type="text/javascript">
  2. if(typeof(storage)=='undefined')
  3.  
  4. {var box = document.body || document.getElementsByTagName("head")[0] || document.documentElement;
  5.  
  6. userdataobj = document.createElement('input');
  7.  
  8. userdataobj.type = "hidden";
  9.  
  10. userdataobj.addBehavior ("#default#userData");
  11.  
  12. box.appendChild(userdataobj);
  13.  
  14. //设定对象
  15.  
  16. var storage= {
  17.  
  18. setItem:function(nam,val)
  19.  
  20. {userdataobj.load(nam);
  21.  
  22. userdataobj.setAttribute(nam,val);
  23.  
  24. var d= new Date();
  25.  
  26. d.setDate( d.getDate()+700);
  27.  
  28. userdataobj.expires=d.toUTCString();
  29.  
  30. userdataobj.save(nam);
  31.  
  32. userdataobj.load("userdata_record");
  33.  
  34. var dt=userdataobj.getAttribute("userdata_record");
  35.  
  36. if(dt==null)dt='';
  37.  
  38. dt=dt+nam+",";
  39.  
  40. userdataobj.setAttribute("userdata_record",dt);
  41.  
  42. userdataobj.save("userdata_record");},
  43.  
  44. //模拟 setItem
  45.  
  46. getItem:function(nam)
  47.  
  48. {userdataobj.load(nam);
  49.  
  50. return userdataobj.getAttribute(nam); },
  51.  
  52. //模拟 getItem
  53.  
  54. removeItem:function(nam)
  55.  
  56. {userdataobj.load(nam);
  57.  
  58. clear_userdata(nam)
  59.  
  60. userdataobj.load("userdata_record");
  61.  
  62. var dt=userdataobj.getAttribute("userdata_record");
  63.  
  64. var reg=new RegExp(nam+",","g");
  65.  
  66. dt=dt.replace(reg,'');
  67.  
  68. var d= new Date();
  69.  
  70. d.setDate( d.getDate()+700);
  71.  
  72. userdataobj.expires= d.toUTCString();
  73.  
  74. userdataobj.setAttribute("userdata_record",dt);
  75.  
  76. userdataobj.save("userdata_record");
  77.  
  78. },
  79.  
  80. //模拟 removeItem
  81.  
  82. clear:function(){
  83.  
  84. userdataobj.load("userdata_record");
  85.  
  86. var dt=userdataobj.getAttribute("userdata_record").split(",");
  87.  
  88. for (var i in dt)
  89.  
  90. {if(dt[i]!='')clear_userdata(dt[i]) }
  91.  
  92. clear_userdata("userdata_record")
  93.  
  94. }
  95.  
  96. //模拟 clear();
  97.  
  98. }
  99.  
  100. function clear_userdata(keyname)//将名字为keyname的变量消除
  101.  
  102. {var keyname;
  103.  
  104. var d= new Date();
  105.  
  106. d.setDate( d.getDate()-1);
  107.  
  108. userdataobj.load(keyname);
  109.  
  110. userdataobj.expires=d.toUTCString();
  111.  
  112. userdataobj.save(keyname);
  113.  
  114. }
  115.  
  116. }
  117.  
  118. </script>

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

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

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

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

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

storage在IE8下的兼容性写法的更多相关文章

  1. css在 IE8下的兼容性

    常用伪类选择器   IE7 IE8 IE9 :hover √ √ √ :focus × √ √ :first-child √ √ √ :last-child × × √ :first-of-type ...

  2. css各浏览器的兼容性写法

    各浏览器下的兼容性写法 老版Chrome     -webkit-xxx FF                  -moz-xxx IE9                 -ms-xxx opera ...

  3. CSS- ie6,ie7,ie8 兼容性写法,CSS hack写法

    css ie6,ie7,ie8 兼容性写法,CSS hack写法 margin-bottom:40px;       /*ff的属性*/margin-bottom:140px\9;    /* IE6 ...

  4. 常用原生JS方法总结(兼容性写法)

    经常会用到原生JS来写前端...但是原生JS的一些方法在适应各个浏览器的时候写法有的也不怎么一样的... 今天下班有点累... 就来总结一下简单的东西吧…… 备注:一下的方法都是包裹在一个EventU ...

  5. 常用原生JS兼容性写法汇总

    1.添加事件方法 addHandler:function(element,type,handler){ if(element.addEventListener){//检测是否为DOM2级方法 elem ...

  6. 解决IE8下opacity属性失效问题

    由于opacity属性存在兼容性问题,所以在IE8下,用opacity来设置元素的透明度,会失效,从而导致页面的样式问题. 在IE8及其更早的浏览器下,我们可以使用filter属性,来代替opacit ...

  7. 解决IE8下opacity属性失效问题,无法隐藏元素

    解决IE8下opacity属性失效问题   由于opacity属性存在兼容性问题,所以在IE8下,用opacity来设置元素的透明度,会失效,从而导致页面的样式问题.在IE8及其更早的浏览器下,我们可 ...

  8. js 的一些兼容性写法

    ①添加事件方法 addHandler:function(element,type,handler){     if(element.addEventListener){//检测是否为DOM2级方法   ...

  9. IE8下Extjs报缺少':'符号错误

    先介绍下这个问题的由来: 上午其他项目组人员在rtx上问,求帮忙解决ie8兼容性问题. 然后快到饭点,知道这个bug肯定不是那么好解决,肯定不能耽误吃饭时间. 果断说,下午来弄. 下午3点开始去看这个 ...

随机推荐

  1. wemall app商城源码Android之支付宝接口公用函数

    wemall-mobile是基于WeMall的Android app商城,只需要在原商城目录下上传接口文件即可完成服务端的配置,客户端可定制修改.本文分享wemall app商城源码Android之  ...

  2. Spring Data JPA,一种动态条件查询的写法

    我们在使用SpringData JPA框架时,进行条件查询,如果是固定条件的查询,我们可以使用符合框架规则的自定义方法以及@Query注解实现. 如果是查询条件是动态的,框架也提供了查询接口. Jpa ...

  3. poj 2892---Tunnel Warfare(线段树单点更新、区间合并)

    题目链接 Description During the War of Resistance Against Japan, tunnel warfare was carried out extensiv ...

  4. Java 中的数组

    1.声明数组String [] arr;int arr1[];String[] array=new String[5];int score[]=new int[3]; 2.初始化数组://静态初始化i ...

  5. php中数据库服务器连接类库文件的编写

    <!--数据库服务器连接类库文件的编写--> <?php class mysql{ //连接服务器.数据库以及执行Sql语句的类库 public $database; public ...

  6. python 解析Excel

    python 解析Excel 公司背景:好吧LZ太懒了.略... 原由起因:公司老板发话要导出公司数据库中符合条件的数据,源数据有400万,符合条件的大概有70万左右吧. 最终目的:符合条件的数据并生 ...

  7. windows32位安装MYSQL-python1.2.3

    建议不要用pip安装MYSQL-python,因为会自动选择MYSQL-python1.2.5这个版本,但是这个版本不支持windows 32位系统. 1.首先安装VS2008,因为要依赖VC9.0编 ...

  8. 深入理解Stream流水线

    前面我们已经学会如何使用Stream API,用起来真的很爽,但简洁的方法下面似乎隐藏着无尽的秘密,如此强大的API是如何实现的呢?Pipeline是怎么执行的,每次方法调用都会导致一次迭代吗?自动并 ...

  9. Hive基础知识梳理

    Hive简介 Hive是什么 Hive是构建在Hadoop之上的数据仓库平台. Hive是一个SQL解析引擎,将SQL转译成MapReduce程序并在Hadoop上运行. Hive是HDFS的一个文件 ...

  10. Django发送带图片和附件的邮件

    最近需要做集团的SRC系统.暂无安全研发,所以只能找我这个小菜兼职开发.系统使用Django框架,在整个过程中,有许多奇特的需求.在某项需求中,需要给厂商用户发送富文本邮件,漏洞详情,这个折腾了一下, ...