We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS

Retorna um vetor de objetos com todos os elementos filhos que possuem o nome da classe dada.  Quando invocado no objeto document, o documento é examinado por completo, incluindo o nó raiz. Você também pode invocar getElementsByClassName() em qualquer elemento; isso retornaria somente elementos que são descendentes do nó raiz especificado com o nome da classe.

Sintaxe

var elementos = document.getElementsByClassName(nomes); // ou:
var elementos = rootElement.getElementsByClassName(nomes);
  • elementos é uma lista viva do HTMLCollection de elementos encontrados.
  • nomes é um texto que representa uma lista dos nomes das classes que são separados por espaço em branco.
  • getElementsByClassName pode ser invocado por qualquer elemento, não somente pelo nó raiz document. O elemento no qual ele é chamado será usado como a raiz para a busca.

Exemplos

Retorna todos os elementos que possuem a classe 'teste'

document.getElementsByClassName('teste');

Retorna todos os elementos que possuem as classes 'vermelho' e 'teste'

document.getElementsByClassName('vermelho teste');

Retorna todos os elementos que possuem a classe 'teste' dentro do elemento que possui o ID 'principal'

document.getElementById('principal').getElementsByClassName('teste');

Nós podemos também usar os métodos do Array.prototype em qualquer dos elementos HTMLCollection passando o HTMLCollection como valor deste método. Aqui podemos encontrar todos os elementos do tipo div que possuem a classe 'teste':

var elementosTeste = document.getElementsByClassName('teste');
var divsTeste = Array.prototype.filter.call(elementosTeste, function(elementoTeste) {
    return elementoTeste.nodeName === 'DIV';
});

Compatibilidade com navegadores

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Características Chrome Firefox (Gecko) Internet Explorer Opera Safari
Suporte básico (Yes) 3.0 9.0 (Yes) (Yes)
Características Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Suporte básico ? ? ? ? ?

Especificação

Etiquetas do documento e colaboradores

Colaboradores desta página: fcard, lucasbento, marcelo.bastos
Última atualização por: fcard,