Range object understanding, browser compatibility, getting the mouse cursor position

First, about browser compatibility

At present, there are 3 kinds of similar objects about range, respectively, the Range object, Mozzlia selection, ie TextRange

For the three differences, check out the documentation http://www.quirksmode.org/dom/w3c_range.html here to face these three are said to be very clear

It can be seen that the range of Mozilla is a Selection object, while in IE the range is a text range which is completely different from Mozilla, so it is necessary for both types of range

Write different compatibility scripts, the current mainstream browser mozilla,chrome Safari,opera support Selection objects, but opera also supports IE under Text Range, but not comprehensive.

So the code should look like this

var selection; Declare Range object
if (window.getselection) {

Mainstream browsers, including Mozilla,chrome,safari
    Selection = Window.getselection ();

    Selection = Document.selection.createRange ();//ie browser processing, if you want to get the content, you need to add the Text property on the Selection object
}

Actually judging the browser compatibility, we can also judge

if (Obj.createtextrange) {
The operation under IE browser
} else if (Obj.setselectionrange) {

Some operations under non-IE

}

I followed the download of these objects under Chrome and IE to show you

Under IE, if you create a Range object, you have

Range.moveend ()

Range.movestart ()

Range.Select ();

Action to implement the selected text

In other browsers, you can use Obj.setselectionrange () to implement the selected operation in the following format:

O.setselectionrange (Start,end);

O: Input Box object for text

Start: The starting position of the string

End: The end position of the string

In the position of the mouse, the implementation of the text insert operation, under IE

Can be passed Document.selection.createRange (). Text = value;

where Document.selection.createRange () is the TextRange object that represents the position of the current mouse, TextRange.Text = value means that the value is inserted at the current mouse point

In other browsers, you can use Obj.value = str +value +str1 form

In non-IE, for text box input obj, there is a selectionstart,selectionend attribute, which indicates the position of the current mouse.

Summarize:

1) mentions that the Range object is not created under the same browser, getting the contents of the text and compatibility issues

2) How to use the Range object to implement text insertion in a text box

3) How to use the Range object to achieve text selection and cursor movement operations

Range object understanding, browser compatibility, getting the mouse cursor position