Selecting Text | Inside JavaScript

You can use the select method to select text in a web browser using text ranges. Here's an example that shows how that works. When you click the button in this web page, the code creates a text range, moves that text range to encompass the text in a <SPAN> element, and selects that text:

(Listing 11-03.html on the web site)

 <HTML>      <HEAD>          <TITLE>              Selecting Text          </TITLE>          <SCRIPT LANGAUGE="JavaScript">              <!--             function selectRange()              {  range = document.body.createTextRange()   range.moveToElementText(text1)   range.select()  }               // -->           </SCRIPT>      </HEAD>      <BODY>          <H1>              Selecting Text          </H1>          <FORM>              <INPUT TYPE="BUTTON" VALUE="Click Me" ONCLICK="selectRange()">          </FORM>          <BR>          <SPAN ID="text1">Click the button to select this text.</SPAN>      </BODY>  </HTML>

You can see the results in Figure 11.3, where I'm selecting text in a browser with the click of a button.

Figure 11.3. Selecting text with text ranges.

graphics/11fig03.gif

Working with selected text is such a common thing to do that you can use a special objectthe selection objectto handle such tasks .