Skip to content
Related Articles

Related Articles

Improve Article

HTML | DOM selectAllChildren() Method

  • Last Updated : 22 Jun, 2020

The selectAllChildren() method adds all the children of the specified node to the current selection.

Syntax:

selection.selectAllChildren( parentNode )

Parameters:

  • parentNode: The node whose children are to be selected.

Example: In this example, all the child elements of the parent div will get selected on button click using this method.

HTML




<!DOCTYPE html>
<html>
  
<head>
    <title>GeeksforGeeks</title>
</head>
  
<body>
    <main>
        <h1>GeeksforGeeks</h1>
    </main>
  
    <div>
        <p>child 1</p>
        <p>child 2</p>
        <p>child 3</p>
    </div>
  
    <button onclick="select()">
        click
    </button>
  
    <script>
        const pNode = document
            .querySelector('div');
              
        function select() {
            window.getSelection()
                .selectAllChildren(pNode);
        };
    </script>
</body>
  
</html>

Output:



Click the button to select child node of parent div:

Supported Browsers: The browsers supported by selectAllChildren() method are listed below:

  • Google Chrome
  • Edge
  • Firefox
  • Opera
  • Safari
  • Internet Explorer.

Attention reader! Don’t stop learning now. Get hold of all the important Comcompetitivepetitve Programming concepts with the Web Design for Beginners | HTML  course.




My Personal Notes arrow_drop_up
Recommended Articles
Page :