Selection and ranges in JavaScript
Related objects:
| Object | Support | Description | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| controlRange | Represents a collection of controls. A control can be a button, select, textarea, one of the input elements or an arbitrary element in contentEditable mode. | |||||||||||
| Range |
|
Represents a contiguous part of the document. | ||||||||||
| selection |
|
Represents the currently selected part of the document. | ||||||||||
| selectionRange |
|
Represents the currently selected part of the document. | ||||||||||
| TextRange |
|
Represents a contiguous part of the document. | ||||||||||
| TextRanges | Represents a collection of TextRange objects that belong to the current selection. |
Related properties:
TextRange properties:
Range properties:
Selection properties:
TextRanges properties:
ControlRange properties:
SelectionRange properties:
| Property | Support | Description | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| boundingHeight (TextRange) |
Returns an integer value that specifies the height of the rectangle that bounds the current TextRange object, in pixels. | |||||||||||
| boundingLeft (TextRange) |
Returns an integer value that specifies the left coordinate of the rectangle that bounds the current TextRange object, in pixels. | |||||||||||
| boundingTop (TextRange) |
Returns an integer value that specifies the top coordinate of the rectangle that bounds the current TextRange object, in pixels. | |||||||||||
| boundingWidth (TextRange) |
Returns an integer value that specifies the width of the rectangle that bounds the current TextRange object, in pixels. | |||||||||||
| htmlText (TextRange) |
Returns the HTML source that belongs to a TextRange object as a string. | |||||||||||
| text (TextRange) |
|
Sets or retrieves a string that specifies the text within a TextRange object. |
| Property | Support | Description | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| collapsed (Range) |
|
Returns a Boolean value that indicates whether the start and end points of the current Range are in the same position. | ||||||||||
| commonAncestorContainer (Range) |
|
Returns a reference to the deepest node in the DOM hierarchy that contains the entire Range object. | ||||||||||
| endContainer (Range) |
|
Returns a reference to the deepest node in the DOM hierarchy that contains the end point of the current Range object. | ||||||||||
| endOffset (Range) |
|
Returns an integer that specifies the end position of the current Range relative to the endContainer element. | ||||||||||
| startContainer (Range) |
|
Returns a reference to the deepest node in the DOM hierarchy that contains the start point of the current Range object. | ||||||||||
| startOffset (Range) |
|
Returns an integer that specifies the start position of the current Range relative to the startContainer element. |
| Property | Support | Description | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| selection (document) |
|
Represents the currently selected part of the document. | ||||||||||
| type (selection) |
|
Returns a string value that identifies the content type of the current selection. |
| Property | Support | Description | |||||
|---|---|---|---|---|---|---|---|
| length (TextRanges) |
Returns an integer that specifies the number of objects in the current collection. |
| Property | Support | Description | |||||
|---|---|---|---|---|---|---|---|
| length (controlRange) |
Returns an integer that specifies the number of objects in the current collection. |
| Property | Support | Description | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| anchorNode (selectionRange) |
|
Returns a reference to the node where the selection begins. | ||||||||||
| anchorOffset (selectionRange) |
|
Returns the start position of the selection relative to the anchor node. | ||||||||||
| focusNode (selectionRange) |
|
Returns a reference to the element where the selection ends. | ||||||||||
| focusOffset (selectionRange) |
|
Returns the end position of the selection relative to the focus node. | ||||||||||
| isCollapsed (selectionRange) |
|
Returns a Boolean value that indicates whether the anchor and focus points of the current selectionRange object are in the same position. | ||||||||||
| rangeCount (selectionRange) |
|
Returns the number of Range objects that belong to the current selection. |
Related methods:
TextRange methods
Range methods
Selection methods
TextRanges methods
SelectionRange methods
ControlRange methods
Range Creation methods
| Method | Support | Description | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| collapse (Range, TextRange) |
Moves the start point of a range to its end point or vice versa. | |||||||||||
| compareEndPoints (TextRange) |
Compares the placement of the start or end point of the current TextRange object with the placement of the start or end point of another TextRange object. | |||||||||||
| duplicate (TextRange) |
|
Returns an exact copy of the current TextRange object. | ||||||||||
| execCommand (document, TextRange, ...) |
Allows running commands on certain objects. | |||||||||||
| expand (TextRange) |
Expands the contents of the TextRange from the insertion point by a character, sentence or word. | |||||||||||
| findText (TextRange) |
Searches for a specified text in the document, relative to a TextRange object. | |||||||||||
| getBookmark (TextRange) |
Saves the current TextRange object into a string (bookmark) that can be used for the moveToBookmark method to return to the original TextRange object. | |||||||||||
| inRange (TextRange) |
Returns whether the current TextRange object contains the specified TextRange object. | |||||||||||
| isEqual (TextRange) |
Returns whether the current TextRange object is identical to the specified TextRange object. | |||||||||||
| move (TextRange) |
|
Moves the end point of the current TextRange object to its start point and moves the collapsed TextRange object by the specified number of units. | ||||||||||
| moveEnd (TextRange) |
|
Moves the end position of the current TextRange object by the specified number of units. | ||||||||||
| moveStart (TextRange) |
|
Moves the start position of the current TextRange object by the specified number of units. | ||||||||||
| moveToBookmark (TextRange) |
Moves the start and end points of the current TextRange object to the positions represented by the specified bookmark. | |||||||||||
| moveToElementText (TextRange) |
|
Aligns the start and end points of the current TextRange object to the text content of the specified element. | ||||||||||
| moveToPoint (TextRange) |
Moves the start and end points of the current TextRange object to the specified position. | |||||||||||
| parentElement (TextRange) |
|
Returns a reference to the deepest node in the DOM hierarchy that contains the entire TextRange object. | ||||||||||
| pasteHTML (TextRange) |
Replaces the contents of the current TextRange object with the specified HTML formatted text. | |||||||||||
| queryCommandEnabled (document, TextRange, ...) |
Returns whether the execution of the specified command can be successful, using the execCommand method. | |||||||||||
| queryCommandIndeterm (document, TextRange, ...) |
Returns whether the specified command is in an indeterminate state. | |||||||||||
| queryCommandState (document, TextRange, ...) |
Returns the current state of the specified command. | |||||||||||
| queryCommandSupported (document, TextRange, ...) |
Returns whether the specified command is supported by the current object. | |||||||||||
| queryCommandText (document, TextRange, ...) |
Returns the description of the specified command. | |||||||||||
| queryCommandValue (document, TextRange, ...) |
Returns the actual value of the specified command. | |||||||||||
| select (controlRange, TextRange) |
|
Selects all text or controls that is included in the current TextRange or controlRange object. | ||||||||||
| setEndPoint (TextRange) |
Aligns the start or end point of the current TextRange to the start or end point of the specified TextRange. |
| Method | Support | Description | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| cloneContents (Range) |
|
Creates a DocumentFragment object and copies the contents of the current Range object into it. | ||||||||||
| cloneRange (Range) |
|
Returns an exact copy of the current Range object. | ||||||||||
| collapse (Range, TextRange) |
Moves the start point of a range to its end point or vice versa. | |||||||||||
| compareBoundaryPoints (Range) |
|
Compares the placement of the start or end point of the current Range object with the placement of the start or end point of another Range object. | ||||||||||
| compareNode (Range) |
|
Returns an integer that represents whether the specified node is before, inside, after, or surrounding the current Range object. | ||||||||||
| comparePoint (Range) |
Returns an integer that represents whether the specified point is before, inside or after the current Range object. | |||||||||||
| createContextualFragment (Range) |
Creates a DocumentFragment object from the specified HTML formatted text. | |||||||||||
| deleteContents (Range) |
|
Deletes the contents of the current Range from the document tree. | ||||||||||
| detach (Range) |
|
Releases the current Range object and allows the browser to free up resources. | ||||||||||
| extractContents (Range) |
|
Creates a DocumentFragment object, copies the contents of the current Range object into it and removes the contents of current Range from the document tree. | ||||||||||
| insertNode (Range) |
|
Inserts the specified node at the start of the current Range. | ||||||||||
| intersectsNode (Range) |
|
Returns whether the specified node and the current Range object have an intersection. | ||||||||||
| isPointInRange (Range) |
Returns whether a point is inside the current Range object or not. | |||||||||||
| selectNode (Range) |
|
Aligns the start and end points of the current Range object to the start and end points of the specified node. | ||||||||||
| selectNodeContents (Range) |
|
Aligns the start and end points of the current Range object to the contents of the specified element. | ||||||||||
| setEnd (Range) |
|
Sets the end position of the current Range. | ||||||||||
| setEndAfter (Range) |
|
Sets the end position of the current Range to the end position of the specified node. | ||||||||||
| setEndBefore (Range) |
|
Sets the end position of the current Range to the start position of the specified node. | ||||||||||
| setStart (Range) |
|
Sets the start position of the current Range. | ||||||||||
| setStartAfter (Range) |
|
Sets the start position of the current Range to the end position of the specified node. | ||||||||||
| setStartBefore (Range) |
|
Sets the start position of the current Range to the start position of the specified node. | ||||||||||
| surroundContents (Range) |
|
Places the specified element to surround the contents of the current Range object. |
| Method | Support | Description | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| clear (selection) |
Removes the contents of the current selection from the document. | |||||||||||
| createRange (selection) |
|
Creates a TextRange or controlRange object depending on the type of the selection. | ||||||||||
| createRangeCollection (selection) |
Creates a TextRanges or controlRange collection depending on the type of the selection. | |||||||||||
| empty (selection) |
Cancels the current selection. |
| Method | Support | Description | |||||
|---|---|---|---|---|---|---|---|
| item (TextRanges) |
Returns an object from the current collection by index. |
| Method | Support | Description | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| addRange (selectionRange) |
|
Adds a Range object to the current selection. | ||||||||||
| collapse (selectionRange) |
|
Moves the anchor and focus points of the current selectionRange object to the same, specified point. | ||||||||||
| collapseToEnd (selectionRange) |
|
Moves the start point of the current selectionRange object to its end point. | ||||||||||
| collapseToStart (selectionRange) |
|
Moves the end point of the current selectionRange object to its start point. | ||||||||||
| containsNode (selectionRange) |
Returns whether the specified node is a part of the current selectionRange object. | |||||||||||
| deleteFromDocument (selectionRange) |
|
Removes the contents of the current selection from the document. | ||||||||||
| extend (selectionRange) |
Moves the focus point of the current selectionRange object to the specified point. | |||||||||||
| getRangeAt (selectionRange) |
|
Retrieves a Range object by position that belongs the current selectionRange object. | ||||||||||
| removeAllRanges (selectionRange) |
|
Cancels the current selection. | ||||||||||
| removeRange (selectionRange) |
|
Removes a Range object from the current selection. | ||||||||||
| selectAllChildren (selectionRange) |
|
Cancels the current selection and selects the child elements of the specified element. | ||||||||||
| selectionLanguageChange (selectionRange) |
Modifies the cursor Bidi level. | |||||||||||
| toString (Range, selectionRange) |
|
Returns the text content of a Range or selectionRange object. |
| Method | Support | Description | |||||
|---|---|---|---|---|---|---|---|
| add (controlRange) |
Inserts a control into the current collection at the last position. | ||||||
| addElement (controlRange) |
Inserts a control into the controlRange collection at the last position. | ||||||
| item (controlRange) |
Returns an object from the controlRange collection. | ||||||
| remove (controlRange) |
Removes a control from the current collection by index. |
| Method | Support | Description | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| createControlRange (body) |
Creates an empty controlRange collection. | |||||||||||
| createRange (document, XMLDocument) |
|
Creates an empty Range object. | ||||||||||
| createTextRange (body, input, textarea, ...) |
|
Creates a new TextRange object and aligns its start and end points to the text content of the current element. | ||||||||||
| getSelection (document) |
|
Returns the selected content in the current document as a string. | ||||||||||
| getSelection (window) |
|
Returns a selectionRange object representing the selected content in the current document. |
User Contributed Comments
