Skip to content
Related Articles

Related Articles

Improve Article

HTML DOM getRangeAt() method

  • Last Updated : 03 Jul, 2020

The getRangeAt() method returns the range object which contains startOffset index and endOffset index from the selected text.

Syntax:

range = selection.getRangeAt(index)

Parameters:

  • index: zero-based index from the rangeCount of the document.

Return value:

  • Return the Range object which contain startOffset and endOffset index of selected text.

Example:



In this example, we will select some text and will get range of selected text.




<html>
   <head>
      <title>GeeksforGeeks</title>
      </head>
      <body>
          <h1>GeeksforGeeks</h1>
        <p>select some text and click on
      button to get the range of selection</p>
        <button onclick="range()">Click</button>
      </body>
        <script>
            function range(){
                 let ranges = [];
              sel = window.getSelection();
              for(let i = 0; i < sel.rangeCount; i++) {
               ranges[i] = sel.getRangeAt(i);
               console.log(ranges[i])
              }
              }
        </script>
</html>

Output:

In console, range objects can be seen:

Supported Browsers:

  • Google Chrome
  • Edge
  • Firefox
  • Opera
  • Safari

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 :