JavaScript Selections: TextRange Objects - Doc JavaScript
TextRange Objects
A TextRange
object represents text in an HTML element. The easiest way to understand this object, which is only available on Win32 platforms (Internet Explorer 4.0x), is to work with an example. Take a look at the following HTML code:
<HTML>
<HEAD>
<TITLE>Sample Page</TITLE>
</HEAD>
<BODY>
<H1>This is a sample page.</H1>
<P>This is some sample text.</P>
</BODY>
</HTML>
An HTML document's text is known as the stream. The stream is basically the entire code, with all tag definitions stripped off. In other words, HTML elements do not affect the stream. For instance, the stream in the previous example is:
This is a sample page. This is some sample text.
The TextRange
object reflects the stream for a given portion of the document. With this object you can manipulate the stream to modify the text that appears on the page. You can use this object to retrieve and modify text in an element, to locate specific strings in the text, and to carry out commands that affect the appearance of the text. A TextRange
object is usually defined with the desired element's TextRange()
method, as demonstrated in the following statement:
var range = document.body.createTextRange();
This method can only be applied to a BODY
, BUTTON
, TEXTAREA
, or an INPUT
element having text type (TYPE="text"
).
Another way to create a TextRange
object is to use the document.selection
object's createRange()
method in the following fashion:
var range = document.selection.createRange();
After selecting a text range, you can use several methods to manipulate the resulting TextRange
object. We'll discuss these methods in the next section of this column.
Created: January 279, 1998
Revised: January 29, 1998
URL: https://www.webreference.com/js/column12/textrange.html