Como contar a quantidade de elementos filhos em JavaScript

Neste artigo você vai aprender a como contar a quantidade de elementos filhos, utilizando uma técnica simples

Fala programador(a), beleza? Bora aprender mais sobre DOM em JavaScript!

Para saber quantos elementos filhos um determinado elemento pai tem, vamos precisar selecionar os elementos filhos dele

Temos vários métodos para fazer isso, alguns deles são:

• getElementsByTagName;
• querySelectorAll;
• getElementsByClassName;

Lembrando que tem que ser um método que selecione vários elementos

Escolha o que melhor se adequa ao seu projeto, e podemos prosseguir para a próxima parte

Que é apenas acessar a propriedade length dos elementos que foram selecionados

Isso nos dará um inteiro, com a quantidade de elementos filhos

Veja um exemplo prático:

const inputs = document.querySelectorAll("form input")

console.log(inputs.length) // 2

No exemplo acima queremos verificar quantos inputs há em um determinado formulário

Foi feita a seleção dos inputs daquele form, e depois avaliada a propriedade length

Que nos retornou 2, ou seja, há dois inputs no formulário

Quer aprender mais sobre JavaScript? Confira o vídeo abaixo:

Conclusão

No artigo de hoje você viu como contar a quantidade de elementos filhos

Precisamos selecionar estes elementos filhos, utilizando algum método de seleção

E depois acessar a propriedade length do resultado dos elementos selecionados

Deseja programar de forma profissional? Confira o nosso treinamento completo clicando aqui.

Uma plataforma de cursos com projetos completos, comunidade de alunos e muito mais!

Há também o nosso canal no YouTube, com muito conteúdo gratuito de qualidade!