The Range interface represents a fragment of a document that can contain nodes and parts of text nodes.
A range can be created by using the Document.createRange() method. Range objects can also be retrieved by using the getRangeAt() method of the Selection object or the caretRangeFromPoint() method of the Document object.
There also is the Range() constructor available.
There are no inherited properties.
Range.collapsed Read only
Returns a boolean value indicating whether the range's start and end points are at the same position.
Range.commonAncestorContainer Read only
Returns the deepest Node that contains the startContainer and endContainer nodes.
Range.endContainer Read only
Returns the Node within which the Range ends.
Range.endOffset Read only
Returns a number representing where in the endContainer the Range ends.
Range.startContainer Read only
Returns the Node within which the Range starts.
Range.startOffset Read only
Returns a number representing where in the startContainer the Range starts.
There are no inherited methods.
Range.collapse()
Collapses the Range to one of its boundary points.
Range.compareBoundaryPoints()
Compares the boundary points of the Range with another Range.
Range.compareNode() Deprecated Non-standard
Returns a constant representing whether the Node is before, after, inside, or surrounding the range.
Range.comparePoint()
Returns -1, 0, or 1 indicating whether the point occurs before, inside, or after the Range.
Range.cloneContents()
Returns a DocumentFragment copying the nodes of a Range.
Range.cloneRange()
Returns a Range object with boundary points identical to the cloned Range.
Range.createContextualFragment()
Returns a DocumentFragment created from a given string of code.
Range.deleteContents()
Removes the contents of a Range from the Document.
Range.detach()
Does nothing. Kept for compatibility.
Range.extractContents()
Moves contents of a Range from the document tree into a DocumentFragment.
Range.getBoundingClientRect()
Returns a DOMRect object which bounds the entire contents of the Range; this would be the union of all the rectangles returned by range.getClientRects().
Range.getClientRects()
Returns a list of DOMRect objects that aggregates the results of Element.getClientRects() for all the elements in the Range.
Range.isPointInRange()
Returns a boolean indicating whether the given point is in the Range.
Range.insertNode()
Insert a Node at the start of a Range.
Range.intersectsNode()
Returns a boolean indicating whether the given node intersects the Range.
Range.selectNode()
Sets the Range to contain the Node and its contents.
Range.selectNodeContents()
Sets the Range to contain the contents of a Node.
Range.setEnd()
Sets the end position of a Range.
Range.setStart()
Sets the start position of a Range.
Range.setEndAfter()
Sets the end position of a Range relative to another Node.
Range.setEndBefore()
Sets the end position of a Range relative to another Node.
Range.setStartAfter()
Sets the start position of a Range relative to another Node.
Range.setStartBefore()
Sets the start position of a Range relative to another Node.
Range.surroundContents()
Moves content of a Range into a new Node.
Range.toString()
Returns the text of the Range.
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
Range |
29 | 15 | 24 | No | 16 | 8 | 4.4 | 29 | 24 | 16 | 8 | 2.0 |
Range |
1 | 12 |
1Starting with Firefox 13, theRange object throws a DOMException as defined in DOM 4, instead of a RangeException defined in prior specifications.
|
9 | 9 | 1 | 4.4 | 18 |
4Starting with Firefox 13, theRange object throws a DOMException as defined in DOM 4, instead of a RangeException defined in prior specifications.
|
10.1 | 1 | 1.0 |
cloneContents |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
cloneRange |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
collapse |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
collapsed |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
commonAncestorContainer |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
compareBoundaryPoints |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
compareNode |
1–45 | No | 1–3 | No | 15–32 | 3 | 4.4–45 | 18–45 | No | 14–32 | 1 | 1.0–5.0 |
comparePoint |
1 | 17 | 1 | No | ≤12.1 | 3 | 4.4 | 18 | 4 | ≤12.1 | 1 | 1.0 |
createContextualFragment |
1 | 12 | 1 | 10 | ≤12.1 | 1 | 4.4 | 18 | 4 | ≤12.1 | 1 | 1.0 |
deleteContents |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
detach |
1Starting in Chrome 37, this method is a no-op and has no effect. |
12 |
1–15Starting in Firefox 15.0, this method is a no-op and has no effect. |
9 |
9Starting in Opera 24, this method is a no-op and has no effect. |
1Since August 2015 this method is a no-op in WebKit-based browsers. |
4.4Starting in Chrome 37, this method is a no-op and has no effect. |
18Starting in Chrome 37, this method is a no-op and has no effect. |
4–15Starting in Firefox 15.0, this method is a no-op and has no effect. |
10.1Starting in Opera 24, this method is a no-op and has no effect. |
1Since August 2015 this method is a no-op in WebKit-based browsers. |
1.0Starting in Samsung Internet 3.0, this method is a no-op and has no effect. |
endContainer |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
endOffset |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
extractContents |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
getBoundingClientRect |
4 | 12 | 4 | 9 | ≤12.1 | 5 | ≤37 | 18 | 4 | ≤12.1 | 4 | 1.0 |
getClientRects |
4 | 12 | 4 | 9 | ≤12.1 | 5 | ≤37 | 18 | 4 | ≤12.1 | 4 | 1.0 |
insertNode |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
intersectsNode |
1 | 17 | 17 | No | ≤12.1 | 3 | 4.4 | 18 | 19 | ≤12.1 | 1 | 1.0 |
isPointInRange |
1 | 15 | 1 | No | ≤12.1 | 3 | 4.4 | 18 | 4 | ≤12.1 | 1 | 1.0 |
selectNode |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
selectNodeContents |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
setEnd |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
setEndAfter |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
setEndBefore |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
setStart |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
setStartAfter |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
setStartBefore |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
startContainer |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
startOffset |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
surroundContents |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
toString |
1 | 12 | 1 | 9 | 9 | 1 | 4.4 | 18 | 4 | 10.1 | 1 | 1.0 |
© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/Range