DOM:document.getElementsByClassName

De MDC

« Referência do DOM Gecko

Tabela de conteúdo 1 Resumo 2 Sintaxe 3 Exemplos 4 Especificação

[editar] Resumo

Retorna um conjunto de elementos com o nome de classe fornecido. Todo o documento é procurado, incluindo o nó raiz.

[editar] Sintaxe

elements = document.getElementsByClassName(name)

• elements é um NodeList vivo de elementos encontrados na ordem que aparecem na árvore.
• name é uma string representando um nome de classe dos elementos.

[editar] Exemplos

Pega todos os elementos que têm a classe 'teste':

 document.getElementsByClassName('teste')

Pega todos os elementos que têm as classes 'vermelho' e 'teste':

 document.getElementsByClassName('vermelho teste')

Pega todos os elementos que têm a classe 'teste', dentro de um elemento que tem o ID 'principal':

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

E se formos adiante e adicionarmos extras do Array do JavaScript 1.6, podemos fazer algumas combinações realmente boas.

Encontre todos os elementos div que têm a classe 'teste'

 Array.filter( document.getElementsByClassName('teste'), function(elem){
   return elem.nodeName == 'DIV';
 });

Encontre todos os elementos que têm a classe 'teste' (como faz seu elemento pai)

 var teste = document.getElementsByClassName('teste');
 Array.filter( teste, function(elem){
   return Array.indexOf( teste, elem.parentNode ) > -1;
 });

[editar] Especificação

WHATWG Web Applications 1.0: getElementsByClassName