Método HTML DOM getElementsByTagName()
❮ O Objeto ElementoExemplo
Altere o conteúdo HTML do primeiro elemento <li> (índice 0) em uma lista:
var list = document.getElementsByTagName("UL")[0];
list.getElementsByTagName("LI")[0].innerHTML = "Milk";
Definição e uso
O método getElementsByTagName() retorna uma coleção de elementos filho de um elemento com o nome de tag especificado, como um objeto NodeList.
O objeto NodeList representa uma coleção de nós. Os nós podem ser acessados por números de índice. O índice começa em 0.
Dica: Você pode usar a propriedade length do objeto NodeList para determinar o número de nós filho com o nome de tag especificado, então você pode percorrer todos os nós e extrair as informações desejadas.
Dica: O valor do parâmetro "*" retorna todos os elementos filho do elemento.
Suporte ao navegador
Os números na tabela especificam a primeira versão do navegador que oferece suporte total ao método.
| Method | |||||
|---|---|---|---|---|---|
| getElementsByTagName() | 1.0 | 6.0 | 3.0 | 3.0 | 9.5 |
Sintaxe
element.getElementsByTagName(tagname)
Valores de parâmetro
| Parameter | Type | Description |
|---|---|---|
| tagname | String | Required. The tagname of the child elements you want to get |
Detalhes técnicos
| Versão DOM | Objeto de elemento de nível 1 principal |
|---|---|
| Valor de retorno: | Um objeto NodeList, representando uma coleção de elementos filho do elemento com o tagname especificado. Os elementos na coleção retornada são classificados conforme aparecem no código-fonte. |
Mais exemplos
Exemplo
Descubra quantos elementos <p> existem dentro de um elemento <div> (usando a propriedade length do objeto NodeList):
var x =
document.getElementById("myDIV").getElementsByTagName("P").length;
Exemplo
Altere a cor de fundo do segundo elemento <p> (índice 1) dentro de um elemento <div>:
var x =
document.getElementById("myDIV");
x.getElementsByTagName("P")[1].style.backgroundColor = "red";
Exemplo
Altere a cor de fundo de todos os elementos <p> dentro de um elemento <div>:
var x = document.getElementById("myDIV");
var y = x.getElementsByTagName("P");
var i;
for (i = 0; i < y.length; i++) {
y[i].style.backgroundColor = "red";
}
Exemplo
Altere a cor de fundo do quarto elemento (índice 3) dentro de um elemento <div>:
var x = document.getElementById("myDIV");
x.getElementsByTagName("*")[3].style.backgroundColor = "red";
Exemplo
Usando o parâmetro "*".
Altere a cor de fundo de todos os elementos dentro de um elemento <div>:
var x = document.getElementById("myDIV");
var y = x.getElementsByTagName("*");
var i;
for (i = 0; i < y.length; i++) {
y[i].style.backgroundColor = "red";
}
Páginas relacionadas
Referência JavaScript: document.getElementsByTagName()
Tutorial JavaScript: Lista de nós HTML DOM JavaScript
❮ O Objeto Elemento