• IE6的getElementById bug


    作为DOM最核心的选择器竟然在IE6中有bug,这是何等令人汗颜的事。此bug会在返回第一个id或name等于我们传入id的元素。

    因此,我们取得元素后判定一下它是用name取得的还是用id取得。方法很简单,看看此元素是否显示为id赋值,并且此id值是否等于我们传入的id。如果没有我们就用document.all["XXX"]返回页面上所有id或name等于XXX的元素,逐个比较它的id是否等于我们的传入id。

          var getElementById = function(id){
            var el = document.getElementById(id);
            if(!+"\v1"){
              if(el && el.id === id){
                return el
              }else{
                var els = document.all[id],n = els.length;
                for(var i=0;i<n;i++){
                  if(els[i].id === id){
                    return els[i]
                  }
                }
              }
            }
            return el;
          }
    

    方法很完美是不是,但此判定方法在IE6,IE7中我们遭遇另一个bug的狙击。IE的bug总是官官相卫。表单元素的id值不能为"id"。另,如果是直接用.id的方式来取值,无论是在IE还是标准浏览器,都无法取得正确值,而是返回元素本身的toString()。

    在标准浏览器中,它会弹出:myForm1,myForm2,myForm1,[object HTMLInputElement]。

    在IE8的IE7兼容模式中,它会弹出:myForm1,[object HTMLInputElement],myForm1,[object HTMLInputElement]。

    在IE6中,它则弹出myForm1,object,myForm2,object。

    看来.id与getAttribute("id")都不保险,我们还可以用attributes["id"]与getAttributeNode("id"),它们都返回一个节点,我们再调用它的value就可以正确取得id值了。

          var getElementById = function(id){
            var el = document.getElementById(id);
            if(!+"\v1"){
              if(el && el.attributes['id'].value === id){
                return el
              }else{
                var els = document.all[id],n = els.length;
                for(var i=0;i<n;i++){
                  if(els[i].attributes['id'].value === id){
                    return els[i]
                  }
                }
              }
            }
            return el;
          }
    

    好了,我们测试一下这个修改版getElementById的效果吧。

    PS:最后提一提另一个重要的原生查找API,getElementsByName,IE6与Opera7.5在这个方法上存在更多的Bug,首先它们会返回id等于给定值的元素,其次它们仅仅返回input元素与img元素。由于我基本不用它,修正方法就交由那些对它感兴趣的人吧。

  • 相关阅读:
    如何配置SWRLJess Tab?
    Orz游戏开发框架阅读笔记(一)
    JessDE 在 Eclipse中不能正确安装的问题
    如何在Protege3.4中安装graphviz以便在protege中使用OwlvizTab?
    语义网的学习资源大汇集(转载)
    如何使用Eclipse从Subversion源码服务器下载源码?
    UltraEdit不能对Matlab的M文件进行语法高亮显示问题的解决
    UltraEdit的语法高亮文件网址
    IronPython的致命弱点
    【WPF】用CustomControl打造WPF版的Marquee
  • 原文地址:https://www.cnblogs.com/rubylouvre/p/1610044.html
Copyright © 2020-2023  润新知