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