The selection.selectAll() function in d3.js is used to select all the descendant elements that match the particular selector string which is given as the parameter. If no matches are found then null is returned by this function.
Syntax:
selection.selectAll(selector);
Parameters: The above-given function takes only one parameter which is given above and described below:
- Selector: This is the name of the container to be selected.
Return Values: It returns the array of elements is found else null is returned..
Below given are a few examples of the function given above.
Example1: When selection is not Null.
<!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport"            path1tent="width=device-width,                     initial-scale=1.0">     <title>Document</title> </head> <style> </style> <body>      <div>Geeks for neveropen         <b>This text is in bold</b>         <b>This text is also in bold</b>     </div>     <div><b>Geeks for neveropen</b></div>     <div>Some text</div>   <script src =   </script>   <script src= </script>   <script>       let selection=d3.selectAll("div").selectAll("b");       console.log(selection.nodes());       console.log(selection.node());   </script> </body> </html> |
Output:
Example 2: When selection is null.
<!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport"            path1tent="width=device-width,                     initial-scale=1.0">     <title>Document</title> </head> <style> </style> <body>      <div>Geeks for neveropen         <b>This text is in bold</b>         <b>This text is also in bold</b>     </div>     <div><b>Geeks for neveropen</b></div>     <div>Some text</div>   <script src =   </script>   <script src= </script>   <script>       let selection=d3.selectAll("div").selectAll("br");       console.log(selection.nodes());       console.log(selection.node());   </script> </body> </html> |
Output:
Whether you’re preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, neveropen Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we’ve already empowered, and we’re here to do the same for you. Don’t miss out – check it out now!
… [Trackback]
[…] Find More to that Topic: geeksforgeeks.org/d3-js-selection-selectall-function/ […]