Skip to content
Related Articles

Related Articles

Improve Article

HTML | DOM setRangeText() method

  • Last Updated : 30 Jul, 2019
Geek Week

The setRangeText() method replaces a range of text in input or a textarea with another string.




element.setRangeText(replacement, start, end[, Mode]);


  • replacement: This parameter represents a string that will replace with the exits one.
  • Start: It specifies the index of the first character and it’s optional.
  • end: It specifies the index of character after the last start character it’s also optional.
  • Mode: This attribute defines how the selection should be set all the possible values are described below.
    • select: This will select the newly inserted text.
    • start: It will move the selected text before the newly inserted text.
    • end: Similar to start just move the selected text after the inserted text.
    • preserve: Preserve the selection and its default.


    <!DOCTYPE html>
            DOM focus() Method
            a:focus {
                background-color: magenta;
            <h1 style="color:green;"
            <h2>DOM select() Method</h2>
            <input type="text" id="text-box" size="40"
                value="A online Computer Science Portal.">
            <button onclick="selectText()">
             Update text
                //Main function 
                function selectText() {
                    const select = 
                        (' For Geeks.', 32, 40, 'select');

    Output :
    Before clicking the Update button:

    After clicking Update button.

    Supported Browsers: The supported browsers by HTML | DOM setRangeText() method are listed below:

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

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

    My Personal Notes arrow_drop_up
  • Recommended Articles
    Page :