Propriedade children do DOM HTML

Objeto Elemento DOM HTML

filhosA propriedade filho retorna uma coleção ativa de HTML, que contém todos os elementos filhos do elemento pai especificado.

Os elementos na coleção são ordenados pela ordem em que aparecem no código-fonte.

Você pode acessar os elementos filhos individuais na coleção usando o número de índice, e o índice começa em 0.

Use a propriedade length para determinar o número de elementos filhos, e em seguida, você pode percorrer todos os elementos filhos.

Anotação:Se o elemento pai não tiver elementos filhos, o elemento filho será uma lista vazia de comprimento 0.

Esta propriedade está relacionada achildNodesA diferença está naquilo que contém, onde os nodos filhos incluem todos os nós, incluindo nós de texto e de comentário, enquanto os elementos filhos incluem apenas nós de elemento.

Sintaxe:

ParentElement.children

var list = document.body.children;

Compatibilidade do Navegador

Os números na tabela especificam a primeira versão do navegador que suporta completamente o atributo children:

Detalhes Técnicos

Mais Exemplos

Encontre quantos filhos o elemento DIV tem:

var len = document.querySelector("div").children.length;

Altere o texto do segundo filho do elemento DIV (índice1] cor de fundo:

var parent = document.querySelector("div");
var list = parent.children;
list[1].style.backgroundColor = "coral";

Altere o texto do primeiro filho do elemento DIV (índice 0):

var parent = document.querySelector("div");
var list = parent.children;
list[0].innerHTML = "HELLO WORLD";

Objeto Elemento DOM HTML