Filhos do elemento HTML DOM
O Objeto ElementoExemplo
Obtenha uma coleção dos filhos do elemento <body>:
const collection = document.body.children;
Mais exemplos abaixo.
Definição e uso
A childrenpropriedade retorna uma coleção de elementos filho de um elemento.
A childrenpropriedade retorna um objeto HTMLCollection.
Uma diferença
A childNodespropriedade retorna todos os nós filho , incluindo nós de texto e nós de comentário, enquanto a childrenpropriedade retorna apenas os elementos filho .
Veja também:
A propriedade childNodes do elemento
HTMLCollection
Uma HTMLCollection é uma coleção de nós HTML.
Os nós em uma coleção podem ser acessados por números de índice. O índice começa em 0.
A propriedade length retorna o número de elementos na coleção.
Sintaxe
element.children
Valor de retorno
| Modelo | Descrição |
| Objeto | Um objeto HTMLCollection. A coleção de nós de elemento. Os elementos são classificados conforme aparecem no documento. |
Mais exemplos
Descubra quantos filhos um elemento <div> tem:
var c =
document.getElementById("myDIV").children.length;
Altere a cor de fundo do segundo elemento filho de um elemento <div>:
var c = document.getElementById("myDIV").children;
c[1].style.backgroundColor = "yellow";
Obtenha o texto do terceiro elemento filho (índice 2) de um elemento <select>:
var c = document.getElementById("mySelect").children[2].text;
Percorra todos os filhos de <body> e altere a cor de fundo para vermelho:
var c = document.body.children;
var i;
for (i = 0; i < c.length; i++) {
c[i].style.backgroundColor = "red";
}
Páginas relacionadas
Referência HTML DOM: propriedade childNodes
Suporte ao navegador
element.childrené um recurso DOM Nível 1 (1998).
É totalmente suportado em todos os navegadores:
| Chrome | IE | Edge | Firefox | Safari | Opera |
| Yes | 9-11 | Yes | Yes | Yes | Yes |
O Objeto Elemento