HTML | DOM hasChildNodes() Method

Difficulty Level : Medium
Last Updated : 16 Jan, 2019

The HTML hasChildNodes() property will return true if the given node has a child node or false if it doesn’t have any child nodes. A blank line or whitespace is also treated a child node so it also returns true on a blank line or whitespace.
Prerequist DOM (Document Object Model)

Parameters:
No parameters required.

Return value: The HTML nodeValue property returns the following type of values.

True if the given node has a child or blank space or a blank line.

False if the given node doesn’t have any child.

Syntax

node.hasChildNodes()

Example-1: In the following paragraph tag has nothing so its return false

<!DOCTYPE html> 
<html> 
  
<body> 
  
    <head> 
        <script> 
  
            // utility function to demonstarte hasChildNode  Property 
            function exampleFunction() { 
                
                // var x used to get the information of those node  
                // for which you want to perform  
                // hasChildNode properties 
                var res =  
                document.getElementById("divId").hasChildNodes(); 
                
                document.getElementById("GeeksForGeeks"+ 
                ).innerHTML = res; 
            } 
        </script> 
    </head> 
  
    <!--In this example we will create a node of the type div 
     and a button which calls a function name "exampleFunction"  
     on clicking of this button it will show the properties of  
     hasChildNode property -->
    <p id="divId"></p> 
    <br> 
  
    <button onclick="exampleFunction()"> 
      click to know the paragraph tag has any child node 
    </button> 
    
    <!-- below paragraph Tag is used to  
    print the value of nodeValue properties-->
    <p id="GeeksForGeeks"></p> 
</body> 
  
</html> 

Output:

Example-2 :In the following paragraph tag has a massage so its return true

<!DOCTYPE html> 
<html> 
  
<body> 
  
    <head> 
  
        <script> 
  
            // utility function to demonstarte hasChildNode Property 
            function exampleFunction() { 
  
                // var x used to get the information of those nodes 
                // for which you want to perform  
                // hasChildNode properties. 
                var res =  
                document.getElementById("divId").hasChildNodes(); 
                
                document.getElementById("GeeksForGeeks"+ 
                ).innerHTML = res; 
            } 
        </script> 
    </head> 
    <!--In this example we will create a node of the type div 
     and a button which calls a function name "exampleFunction"  
     on clicking of this button it will show the properties of  
     hasChildNode property -->
    <p id="divId">Hello geeksforgeeks</p> 
    <br> 
  
    <button onclick="exampleFunction()"> 
      click to know the paragraph tag has any child 
    </button> 
    
    <!-- below paragraph Tag is used to print the  
         value of nodeValue properties-->
    <p id="GeeksForGeeks"></p> 
</body> 
  
</html> 

Output:

Supported Browsers: The browser supported by DOM click() Method are listed below:

Google Chrome

Apple Safari

Firefox

Opera

Edge

My Personal Notes

Related Articles