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”; }