HTML DOM childElementCount Property

Last Updated : 13 Jun, 2023

The DOM childElementCount property is used to count the number of child elements and return it. It counts only child elements except for text and comment nodes. 

Syntax:

node.childElementCount

Where a node is an object which represents the document or element. 

Return Value: It returns the number of child elements of the given element. 

Example: In this example, we will see the use of the DOM childElementCount property

HTML
<!DOCTYPE html>
<html>
<head>
    <title>
        DOM childElementCount Property
    </title>
</head>
<body>
    <h1>GeeksforGeeks</h1>
    <h2>
        DOM childElementCount Property
    </h2>
    <p>Searching Algorithms</p>
    <ul id="parent">
        <li>Merge sort</li>
        <li>Quick sort</li>
    </ul>
    <button onclick="geek()">Click Here!</button>
    <p id="p"></p>
    <script>
        function geek() {
            let doc =
                document.getElementById("parent").childElementCount;
            document.getElementById("p").innerHTML =
                "No of entries: " + doc;
        }
    </script>
</body>
</html>

Output: 

 

Supported Browsers: The browser supported by DOM childElementCount property are listed below:

  • Google Chrome 1.0
  • Edge 12.0
  • Internet Explorer 9.0
  • Firefox 3.5
  • Opera 10.0
  • Safari 4.0
Comment