En este artículo, contaremos cada elemento (incluido el encabezado, el cuerpo, etc.) en el documento usando jQuery. Para contar todos los elementos HTML, usamos la propiedad de longitud. La propiedad de longitud se utiliza para contar el número de elementos del objeto jQuery.
Sintaxis:
$(selector).length
donde selector es el objeto cuya longitud se va a calcular.
Ejemplo:
HTML
<!DOCTYPE html> <html lang="en"> <head> <!-- Import jQuery cdn library --> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <script> $(document).ready(function () { $("button").click(function () { var count = $(".GFG").find("*").length; $("p").after("<h3>Total Div Elements: " + count); }); }); </script> </head> <body style="text-align: center;"> <h1 style="color: green;"> GeeksforGeeks </h1> <h3> How to count all elements within a div using jQuery? </h3> <div class="GFG"> <p> GeeksforGeeks computer science portal </p> <input type="text"> </div><br> <button>Click Here!</button> </body> </html>
Producción:
Antes de hacer clic en el botón:
Después de hacer clic en el botón: