Objeto JavaScript

Manual de Referência do JavaScript

Manual de Referência do DOM JS

Objeto Elemento do HTML DOM Objeto Documento do HTML DOM

Método getElementsByClassName() do HTML DOM

getElementsByClassName()O método pode obter elementos com o valor de classe especificado e retorna um conjunto.

Os elementos na lista retornada são ordenados na ordem em que aparecem no código-fonte.

É possível acessar a lista retornada pelo índice. O índice começa em 0.

Uso do arraylengthA propriedade determina o número de elementos que possuem o nome de classe especificado, e em seguida, é possível percorrer todos os elementos e extrair a informação necessária.

Sintaxe:

document.getElementsByClassName(class)

Exemplo

var x = document.getElementsByClassName("demo");

Testar e Verificar‹/›

Compatibilidade do navegador

O método getElementsByClassName() é completamente suportado por todos os navegadores:

Método
getElementsByClassName()	É	É	É	É	É

Valor do parâmetro

Parâmetro	Descrição
class	Uma string que representa o nome da classe do elemento a ser obtido. Para procurar múltiplos nomes de classe, separe-os com espaços, por exemplo, 'demo color'.

Detalhes técnicos

Retorno:	Retorna um objeto semelhante a um array com todos os elementos filhos que possuem todos os nomes de classe fornecidos.
Versão DOM:	Nível DOM1

Mais Exemplos

Obter todos os elementos usando as classes "demo" e "color":

Exemplo

var x = document.getElementsByClassName("demo color");

Testar e Verificar‹/›

Mudar a cor de fundo de todos os elementos usando class="demo":

Exemplo

var x = document.getElementsByClassName("demo");
for(let i = 0; i < x.length;++) {
　　　x[i].style.backgroundColor = "coral";
}

Testar e Verificar‹/›

Referências Relacionadas

DOM Document querySelector()Métodos

DOM Document querySelectorAll()Métodos

DOM Document getElementById()Métodos

DOM Document getElementsByTagName()Métodos

Objeto Documento do HTML DOM

Objeto Elemento do HTML DOM Objeto Documento do HTML DOM