Dado un documento HTML que contiene algunos elementos anidados, la tarea es contar todos los elementos secundarios de un elemento en particular. Es muy simple contar la cantidad de elementos secundarios de un elemento en particular usando JavaScript. Por ejemplo: si tiene un elemento principal que consta de muchos elementos secundarios, puede usar la propiedad HTML DOM childElementCount para contar todos los elementos secundarios de un elemento en particular.
Sintaxis
node.childElementCount
Ejemplo:
<!DOCTYPE html>
<html>
<head>
<title>
How to count all child elements of a
particular element using JavaScript?
</title>
</head>
<body>
<h1 style="color:green">GeeksforGeeks</h1>
<h3>
Click the button to count all<br>
children the div element
</h3>
<h5>Count all child elements of <ul> elements</h5>
<ul id="parentID">
<li>First element</li>
<li>Second element</li>
<li>Third element</li>
<li>Fourth element</li>
</ul>
<button onclick="myGeeks()">
Click Here!
</button>
<h5 id="GFG"></h5>
<script>
// This function count the child elements
function myGeeks() {
var count = document.getElementById(
"parentID").childElementCount;
document.getElementById("GFG").innerHTML
= "Total Number of Child node: "
+ count;
}
</script>
</body>
</html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Publicación traducida automáticamente
Artículo escrito por _tanya_sri_ y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA