Element.getElementsByClassName()

Element.getElementsByClassName() метод возвращает HTMLCollection содержащие в себе все дочерние элементы с классами. Если вызван на объекте document, будут возвращены все элементы содержащиеся в документе.

Так же как медтод Document.getElementsByClassName() действует на весь документ; это вернет элементы которые являются потомками корневого элемента, содержащие в себе указанные классы.

Syntax

var elements = element.getElementsByClassName(names);

• elements HTMLCollection содержащий найденные элементы.
• names строка содержащая в себе имена классов; имена разделяются пробелами
• element любой Element в документе(в котором осуществляется выборак).

Examples

Получить все элементы с классом test:

element.getElementsByClassName('test');

Получить все элементы с классами test и red:

element.getElementsByClassName('red test');

Получить все элементы с классом test, которые находятся в элементе с id main:

document.getElementById('main').getElementsByClassName('test');

Мы так же можем использовать все методы из Array.prototype на любом  HTMLCollection путем передачи HTMLCollection в метод как значение this. Так мы найдем все <div> элементы которые имеют класс test:

var testElements = document.getElementsByClassName('test');
var testDivs = Array.prototype.filter.call(testElements, function(testElement){
    return testElement.nodeName === 'div';
});

Specifications

Browser compatibility

[1] Prior to Firefox 19, this method was returning a NodeList; it was then changed to reflects the change in the spec.

[2] Safari on iOS 8 and OS X 10.10 returns a NodeList.