How to Use textRange objects in JavaScript _ javascript skills

This article mainly introduces the usage of textRange objects in JavaScript. For more information, see that TextRange objects are advanced features of Dynamic HTML (DHTML, you can use it to perform many text-related tasks, such as searching and selecting texts. The text range allows you to select characters, words, and sentences from the document. A TextRange object is an abstract object that establishes the start and end positions on the text stream to be displayed in an HTML document.

The following are common attributes and methods of TextRange:

Attribute

BoundingHeight: gets the height of the rectangle bound to the TextRange object.
BoundingLeft gets the distance between the left side of the rectangle bound to the TextRange object and the left side of the rectangle containing the TextRange object.
OffsetLeft: obtains the left position of an object relative to the layout or the parent coordinate specified by the offsetParent attribute.
OffsetTop: obtains the top position of an object relative to the layout or the parent coordinate specified by the offsetParent attribute.
HtmlText gets the width of the rectangle bound to the TextRange object
Set or retrieve text in the range of text
Method

MoveStart: Change the start position of the range
MoveEnd changes the end position of the range
Collapse moves the insert point to the beginning or end of the current range
Move collapse the given text range and move the empty range to the order number.
ExecCommand
Select sets the current selection area to the current object
FindText searches for text in the text and sets the start and end points of the range to enclose the search string.
Using a TextRange Object usually involves three basic steps:

1. Create a text range

2. Set the start point and end point

3. Operate the range

The Code is as follows: