推薦一個封裝好的getElementsByClassName方法_javascript技巧

我們知道，原生的JS給我們提供了getElementsByClassName方法，可以透過此方法取得到含有某指定class的節點集合，注意是集合，也就是此函數傳回一個陣列。

但是，IE卻不支援這個方法，但這方法卻是很有實用性，所以，我們又得專門為IE實作這麼一個函數。

複製程式碼 程式碼如下:

function getElementsByClassName(oEle,sClass,sEle){
  if(oEle.getElementsByClassName){
    return oEle.getElementsByClassName(sClass);
  }else{
    var aEle=oEle.getElementsByTagName(sEle || '*'),
      reg=new RegExp('(^|\s)' sClass '($|\s)'),
      arr=[],
      i=0,
      iLen=aEle.length;

    for(; i       if(reg.test(aEle[i].className)){
        arr.push(aEle[i]);
      }
    }
    return arr;
  }
}

使用方法：

複製程式碼 程式碼如下:

//第一種：選擇document下的所有class為box_box的div元素
  getElementsByClassName(document,'box_box','div')[0].style.background='yellow';

//第二種：選擇document下的所有class為box-box的div元素
  getElementsByClassName(document,'box-box','div')[0].style.background='yellow';

//第三種：選擇document下的所有class為box-box元素
  getElementsByClassName(document,'box-box')[0].style.background='yellow';

oEle、sClass是必填的，sEle是選填的。

sClass中又中橫線或底線親測木有問題，比如說：box-box box_box；但是如果是其他特殊字符就很有可能有問題了，如：box$box…  當然可以自己加轉義搞定特殊字符，如：box\$box…

相容性：親測ie6

小夥伴們自己使用一下就知道了，超級好用，擴散下給其他小夥伴吧。