You are here: Reference > JavaScript > client-side > selection and ranges

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
9
Represents a contiguous part of the document.
selection
10.5
Represents the currently selected part of the document.
selectionRange
9
Represents the currently selected part of the document.
TextRange
10.5
Represents a contiguous part of the document.
TextRanges
Represents a collection of TextRange objects that belong to the current selection.

Related properties:

TextRange 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)
10.5
Sets or retrieves a string that specifies the text within a TextRange object.
Range properties:
Property Support Description
collapsed
(Range)
9
Returns a Boolean value that indicates whether the start and end points of the current Range are in the same position.
commonAncestorContainer
(Range)
9
Returns a reference to the deepest node in the DOM hierarchy that contains the entire Range object.
endContainer
(Range)
9
Returns a reference to the deepest node in the DOM hierarchy that contains the end point of the current Range object.
endOffset
(Range)
9
Returns an integer that specifies the end position of the current Range relative to the endContainer element.
startContainer
(Range)
9
Returns a reference to the deepest node in the DOM hierarchy that contains the start point of the current Range object.
startOffset
(Range)
9
Returns an integer that specifies the start position of the current Range relative to the startContainer element.
Selection properties:
Property Support Description
selection
(document)
10.5
Represents the currently selected part of the document.
type
(selection)
10.5
Returns a string value that identifies the content type of the current selection.
TextRanges properties:
Property Support Description
length
(TextRanges)
Returns an integer that specifies the number of objects in the current collection.
ControlRange properties:
Property Support Description
length
(controlRange)
Returns an integer that specifies the number of objects in the current collection.
SelectionRange properties:
Property Support Description
anchorNode
(selectionRange)
9
Returns a reference to the node where the selection begins.
anchorOffset
(selectionRange)
9
Returns the start position of the selection relative to the anchor node.
focusNode
(selectionRange)
9
Returns a reference to the element where the selection ends.
focusOffset
(selectionRange)
9
Returns the end position of the selection relative to the focus node.
isCollapsed
(selectionRange)
9
Returns a Boolean value that indicates whether the anchor and focus points of the current selectionRange object are in the same position.
rangeCount
(selectionRange)
9
Returns the number of Range objects that belong to the current selection.

Related methods:

TextRange 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)
10.5
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)
10.5
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)
10.5
Moves the end position of the current TextRange object by the specified number of units.
moveStart
(TextRange)
10.5
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)
10.5
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)
10.5
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)
10.5
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.
Range methods
Method Support Description
cloneContents
(Range)
9
Creates a DocumentFragment object and copies the contents of the current Range object into it.
cloneRange
(Range)
9
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)
9
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)
3
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)
9
Deletes the contents of the current Range from the document tree.
detach
(Range)
9
Releases the current Range object and allows the browser to free up resources.
extractContents
(Range)
9
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)
9
Inserts the specified node at the start of the current Range.
intersectsNode
(Range)
3
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)
9
Aligns the start and end points of the current Range object to the start and end points of the specified node.
selectNodeContents
(Range)
9
Aligns the start and end points of the current Range object to the contents of the specified element.
setEnd
(Range)
9
Sets the end position of the current Range.
setEndAfter
(Range)
9
Sets the end position of the current Range to the end position of the specified node.
setEndBefore
(Range)
9
Sets the end position of the current Range to the start position of the specified node.
setStart
(Range)
9
Sets the start position of the current Range.
setStartAfter
(Range)
9
Sets the start position of the current Range to the end position of the specified node.
setStartBefore
(Range)
9
Sets the start position of the current Range to the start position of the specified node.
surroundContents
(Range)
9
Places the specified element to surround the contents of the current Range object.
Selection methods
Method Support Description
clear
(selection)
Removes the contents of the current selection from the document.
createRange
(selection)
10.5
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.
TextRanges methods
Method Support Description
item
(TextRanges)
Returns an object from the current collection by index.
SelectionRange methods
Method Support Description
addRange
(selectionRange)
9
Adds a Range object to the current selection.
collapse
(selectionRange)
9
Moves the anchor and focus points of the current selectionRange object to the same, specified point.
collapseToEnd
(selectionRange)
9
Moves the start point of the current selectionRange object to its end point.
collapseToStart
(selectionRange)
9
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)
9
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)
9
Retrieves a Range object by position that belongs the current selectionRange object.
removeAllRanges
(selectionRange)
9
Cancels the current selection.
removeRange
(selectionRange)
9
Removes a Range object from the current selection.
selectAllChildren
(selectionRange)
9
Cancels the current selection and selects the child elements of the specified element.
selectionLanguageChange
(selectionRange)
Modifies the cursor Bidi level.
toString
(Range, selectionRange)
9
Returns the text content of a Range or selectionRange object.
ControlRange methods
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.
Range Creation methods
Method Support Description
createControlRange
(body)
Creates an empty controlRange collection.
createRange
(document, XMLDocument)
9
Creates an empty Range object.
createTextRange
(body, input, textarea, ...)
10.5
Creates a new TextRange object and aligns its start and end points to the text content of the current element.
getSelection
(document)
9
Returns the selected content in the current document as a string.
getSelection
(window)
9
Returns a selectionRange object representing the selected content in the current document.
User Contributed Comments

Post Content

Post Content