getElementsByClassName () не работает в старых Internet Explorer, таких как IE6, IE7, IE8 - PullRequest
13 голосов
/ 05 июля 2011

следующий код:

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

выдает мне сообщение об ошибке в Internet Explorer 6, 7 и 8:

Объект не поддерживает этот метод

Как выбрать элементы по классу в этих браузерах?

Я предпочитаю не использовать JQuery.

Ответы [ 5 ]

14 голосов
/ 05 июля 2011

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;
}; 
12 голосов
/ 05 июля 2011

Это решение может помочь.Это пользовательская getElementsByClassName функция, реализованная в чистом javascript, которая работает в IE.

По сути, этот скрипт проверяет, один за другим, все возможные варианты и выбирает лучший из доступных.Это следующие параметры:

  1. Собственная функция document.getElementsByClassName.
  2. document.evaluate функция, которая позволяет оценивать запросы XPath.
  3. Обход дерева DOM.

Конечно, первый является лучшим с точки зрения производительности, однако последний должен быть доступен везде, включая IE 6.

Пример использования, который также доступен на странице, выглядит следующим образом:

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

Таким образом, функция допускает 3 параметра: класс (обязательно), имя тега (необязательно, поиск всех тегов, если не указан), корневой элемент (необязательно, документ, если не указан).

Обновление. Решение, указанное в сообщении блога, размещено в коде Google, который закрывается в январе 2016 года. Однако автор сделал его доступным для GitHub .Престижность flodin , указывающая на это в комментариях.

5 голосов
/ 31 июля 2014

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

Если вам что-то не нравится, вы можете использовать вашу любимую поисковую систему, чтобы найтидругой.

5 голосов
/ 05 июля 2011

Метод не существует в 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/

0 голосов
/ 17 февраля 2017

Если getElementsByClassname не поддерживает, это ошибка в некоторых старых браузерах Просто попробуй var modal = document.getElementById ('myModal'); modal.onclick = function () { Затем выполните любую функцию onclick или другую функцию с помощью getElementById. modal.style.display = "нет"; }

...