Open In App

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:




<!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=
    </script>
</head>
  
<body>
    <h2>Some text</h2>
    <div>Geeks for Geeks </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:




<!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=
    </script>
</head>
  
<body>
    <div>Some text</div>
    <div>Geeks for <div>geeks</div>
    </div>
    <div>Geeks <div></div> for geeks</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:


Article Tags :