getElementsByClassName（）在IE6，IE7，IE8等舊的Internet Explorer中不起作用

Question

以下代碼：

var borderTds = document.getElementsByClassName('leftborder');

在Internet Explorer 6,7和8中給出了一條錯誤消息：

對象不支持此方法

如何在這些瀏覽器中按類別選擇元素？

我不想使用JQuery。

Answer 1

IE6，Netscape 6 +，Firefox和Opera 7+在您的頁面中復制以下腳本：

document.getElementsByClassName = function(cl) {
  var retnode = [];
  var elem = this.getElementsByTagName('*');
  for (var i = 0; i < elem.length; i++) {
    if((' ' + elem[i].className + ' ').indexOf(' ' + cl + ' ') > -1) retnode.push(elem[i]);
  }
  return retnode;
}; 

Answer 2

此解決方案可能有所幫 這是一個在純javascript中實現的自定義getElementsByClassName函數，可以在IE中使用。

基本上這個腳本正在做的是逐個探測所有可能的選項並選擇最好的選項。 這些選項是：

1. Native document.getElementsByClassName函數。
2. document.evaluate函數，允許評估XPath查詢。
3. 遍歷DOM樹。

當然第一個是性能最好的，但后者應該可以在任何地方使用，包括IE 6。

用法示例（也在頁面上可用）如下所示：

getElementsByClassName("col", "div", document.getElementById("container")); 

因此該函數允許3個參數：class（必需），標記名稱（可選，如果未指定則搜索所有標記），根元素（可選，文檔，如果未指定）。

更新。 博客文章中鏈接的解決方案托管在2016年1月關閉的Google Code上。但是作者已將其發布在GitHub上 。 感謝flodin在評論中指出這一點。

Answer 3

Internet Explorer 8及更早版本不支持getElementsByClassName() 。 如果您只需要IE8的解決方案，它支持querySelectorAll() ，您可以使用其中一個。 對於較舊的IE，您必須提供自己的實現，對於其他支持它的古老瀏覽器，您還可以使用運行XPath表達式的evaluate() 。

此代碼提供了document.getElementsByClassName方法，如果它尚不存在，那么使用我所描述的方法：

if (!document.getElementsByClassName) {
  document.getElementsByClassName = function(search) {
    var d = document, elements, pattern, i, results = [];
    if (d.querySelectorAll) { // IE8
      return d.querySelectorAll("." + search);
    }
    if (d.evaluate) { // IE6, IE7
      pattern = ".//*[contains(concat(' ', @class, ' '), ' " + search + " ')]";
      elements = d.evaluate(pattern, d, null, 0, null);
      while ((i = elements.iterateNext())) {
        results.push(i);
      }
    } else {
      elements = d.getElementsByTagName("*");
      pattern = new RegExp("(^|\\s)" + search + "(\\s|$)");
      for (i = 0; i < elements.length; i++) {
        if ( pattern.test(elements[i].className) ) {
          results.push(elements[i]);
        }
      }
    }
    return results;
  }
}

如果您不喜歡它，可以使用自己喜歡的搜索引擎找到不同的搜索引擎。

Answer 4

該方法在IE6中不存在。 如果要按類選擇元素並且不想使用庫，則只需遍歷頁面中的所有元素並在其className屬性中檢查類。

function getElementsByClassName(className) {
  var found = [];
  var elements = document.getElementsByTagName("*");
  for (var i = 0; i < elements.length; i++) {
    var names = elements[i].className.split(' ');
    for (var j = 0; j < names.length; j++) {
      if (names[j] == className) found.push(elements[i]);
    }
  }
  return found;
}

演示： http ： //jsfiddle.net/kYdex/1/

Answer 5

如果getElementsByClassname不支持在某些舊瀏覽器中出錯只需嘗試var modal = document.getElementById（'myModal'）; modal.onclick = function（）{然后使用getElementById執行任何onclick函數或其他函數modal.style.display =“none”; }