JavaScript, DOM查找元素

1.document.getElementById("id");

  => IE8 及较低版本不区分ID的大小写

  => IE7及较低版本中表单元素的name特性和ID都会被该方法返回

  

2.document.getElementsByTagName("Tag");

  => 为了最大限度的兼容既有的HTML页面,该方法不区分大小写

  => 但在XML和XHTML中区分大小写

3.document.getElementsByName("name");

  => 用于获取带有name属性的表单元素(多用于获取单选按钮(radio)选中的值)

4.document.getElementsByClassName("class");

  => IE8及更低版本不支持该方法

    function getByClass(oParent, sClass){
            var aEle = oParent.getElementsByTagName('*');
            var result = [];
            //var re = '/\b'+sClass+'\b/i';
            ///box/i  /box/i

            var re = new RegExp('\b'+sClass+'\b','i');

            for( i=0;i<aEle.length;i++){
                //if(aEle[i].className == sClass)
                //if(aEle[i].className.search(re))
                if(re.test(aEle[i].className))
                {
                    result.push(aEle[i]);
                }
            }
            return result;
        }

 5.document.querySelector("#id/.class/tag")和document.querySelectorAll()

  => IE7及较低版本不支持

  => 获取的元素为静态nodeList

6.classList属性(obj.classList.add()/obj.classList.remove()/obj.classList.toggle())

  => IE9及较低版本不支持该属性

function removeClass(obj, name) {
  var classNames = obj.className.split(/s/);
  var len = classNames.length;
  
  for(var i=0; i<len; i++){
    if(name === classNames[i]){
      classNames.splice(i, 1);
      break;
    }
  }
 obj.className = classNames.join(" ");
}

原文地址:https://www.cnblogs.com/lianchenxi/p/9391564.html