D3.js selection.node() Function

The selection.node() function in D3.js is used to return the first element in the selection. If the selection does not contain any elements then it returns null. 

Syntax:

selection.node()

Parameters: This function does not accept any parameters.

Return Values: This function returns the first element in the selection.

Example 1:

HTML




<!DOCTYPE html>
<html lang="en">
  
<head>
    <meta charset="UTF-8">
    <meta name="viewport" path1tent=
        "width=device-width,initial-scale=1.0">
    <script src="https://d3js.org/d3.v4.min.js">
    </script>
    <script src=
    "https://d3js.org/d3-selection.v1.min.js">
    </script>
</head>
  
<body>
    <h2>Some text</h2>
    <div>Beginner for Beginner </div>
  
    <script>
        let selection = d3.selectAll("div")
        let div = selection.node();
        console.log(div)
  
        // Printing innerHTML of the tag
        console.log(div.innerHTML)
        selection = d3.selectAll("h1")
          
        // Null is returned
        console.log(selection.node())
    </script>
</body>
  
</html>



Output:

Example 2:

HTML




<!DOCTYPE html>
<html lang="en">
  
<head>
    <meta charset="UTF-8">
    <meta name="viewport" path1tent=
        "width=device-width,initial-scale=1.0">
    <script src="https://d3js.org/d3.v4.min.js">
    </script>
    <script src=
    "https://d3js.org/d3-selection.v1.min.js">
    </script>
</head>
  
<body>
    <div>Some text</div>
    <div>Beginner for <div>Beginner</div>
    </div>
    <div>Beginner <div></div> for Beginner</div>
    <div>Some text</div>
  
    <script>
        let selection = d3.selectAll("div")
        console.log(selection.node())
        selection = d3.selectAll("h2")
  
        // Null is returned
        console.log(selection.node())
    </script>
</body>
  
</html>


Output:



Contact Us