17

以下代码：

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

在 Internet Explorer 6、7 和 8 中给我一条错误消息：

对象不支持此方法

如何在这些浏览器中按类选择元素？

我不喜欢使用 JQuery。

4

5 回答 5

16

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;
};
于 2011-07-05T14:52:39.423 回答
13

此解决方案可能会有所帮助。这是一个getElementsByClassName在纯 javascript 中实现的自定义函数，适用于 IE。

本质上，这个脚本正在做的是一个一个地探测所有可能的选项并选择最好的一个。这些选项是：

  1. 本机document.getElementsByClassName功能。
  2. document.evaluate函数，它允许评估 XPath 查询。
  3. 遍历 DOM 树。

当然，第一个在性能方面是最好的，但是后者应该在任何地方都可用，包括 IE 6。

页面上也提供了使用示例，如下所示：

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

因此该函数允许 3 个参数：类（必需）、标签名称（可选，如果未指定，则搜索所有标签）、根元素（可选，如果未指定，则为文档）。

更新。博客文章中链接的解决方案托管在 Google 代码上，该代码将于 2016 年 1 月关闭。但是作者已在GitHub 上提供了它。感谢弗洛丁在评论中指出这一点。

于 2011-07-05T14:53:20.220 回答
6

该方法在 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/

于 2011-07-05T14:52:17.190 回答
6

Internet Explorer 8 及更早版本不支持getElementsByClassName(). 如果您只需要 IE8 的解决方案，它支持querySelectorAll()，您可以使用其中之一。对于较旧的 IE，您必须提供自己的实现，而对于其他一些支持它的古老浏览器，您也可以使用evaluate()运行 XPath 表达式的。

如果此代码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;
  }
}

如果你不喜欢它，你可以使用你最喜欢的搜索引擎来寻找不同的。

于 2014-07-31T08:43:55.510 回答
-2

如果 getElementsByClassname 在某些旧浏览器中不支持是错误只需尝试 var modal = document.getElementById('myModal'); modal.onclick= function(){ 然后使用 getElementById modal.style.display = "none"; }

于 2017-02-17T07:01:36.243 回答