Range

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.

Properties

There are no inherited properties.

Range.collapsed Read only
Returns a Boolean 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.

Constructor

Range()
Returns a Range object with the global Document as its start and end.

Methods

There are no inherited methods.

Range.setStart()
Sets the start position of a Range.
Range.setEnd()
Sets the end position of a Range.
Range.setStartBefore()
Sets the start position of a Range relative to another Node.
Range.setStartAfter()
Sets the start position of a Range relative to another Node.
Range.setEndBefore()
Sets the end position of a Range relative to another Node.
Range.setEndAfter()
Sets the end position of a Range relative to another Node.
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.collapse()
Collapses the Range to one of its boundary points.
Range.cloneContents()
Returns a DocumentFragment copying the nodes of a Range.
Range.deleteContents()
Removes the contents of a Range from the Document.
Range.extractContents()
Moves contents of a Range from the document tree into a DocumentFragment.
Range.insertNode()
Insert a Node at the start of a Range.
Range.surroundContents()
Moves content of a Range into a new Node.
Range.compareBoundaryPoints()
Compares the boundary points of the Range with another Range.
Range.cloneRange()
Returns a Range object with boundary points identical to the cloned Range.
Range.detach()
Releases the Range from use to improve performance.
Range.toString()
Returns the text of the Range.
Range.compareNode()
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.createContextualFragment()
Returns a DocumentFragment created from a given string of code.
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.intersectsNode()
Returns a boolean indicating whether the given node intersects the Range.
Range.isPointInRange()
Returns a boolean indicating whether the given point is in the Range.

Specifications

Specification Status Comment
DOM
The definition of 'Range' in that specification.
Living Standard Do not use RangeException anymore, use DOMException instead.
Made the second parameter of collapse() optional.
Added the methods isPointInRange(), comparePoint(), and intersectsNode().
Added the constructor Range().
DOM Parsing and Serialization
The definition of 'Extensions to Range' in that specification.
Working Draft Added the method createContextualFragment().
CSS Object Model (CSSOM) View Module
The definition of 'Extensions to Range' in that specification.
Working Draft Added the methods getClientRects() and getBoundingClientRect().
Document Object Model (DOM) Level 2 Traversal and Range Specification
The definition of 'Range' in that specification.
Obsolete Initial specification.

Browser compatibility

DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
RangeChrome Full support 1Edge Full support 12Firefox Full support 4
Notes
Full support 4
Notes
Notes Starting with Firefox 13, the Range object throws a DOMException as defined in DOM 4, instead of a RangeException defined in prior specifications.
IE Full support 9Opera Full support 9Safari Full support 1WebView Android Full support 1Chrome Android Full support 18Firefox Android Full support 4
Notes
Full support 4
Notes
Notes Starting with Firefox 13, the Range object throws a DOMException as defined in DOM 4, instead of a RangeException defined in prior specifications.
Opera Android Full support 10.1Safari iOS Full support 1Samsung Internet Android Full support 1.0
Range() constructor
Experimental
Chrome Full support YesEdge Full support ≤18Firefox Full support 24IE No support NoOpera Full support 15Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 24Opera Android Full support 14Safari iOS Full support YesSamsung Internet Android Full support Yes
cloneContentsChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
cloneRangeChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
collapseChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
collapsedChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
commonAncestorContainerChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
compareBoundaryPointsChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
compareNode
ExperimentalDeprecatedNon-standard
Chrome No support NoEdge No support NoFirefox No support NoIE No support NoOpera No support NoSafari No support NoWebView Android No support NoChrome Android No support NoFirefox Android No support NoOpera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
comparePoint
Experimental
Chrome Full support YesEdge Full support 17Firefox Full support YesIE No support NoOpera Full support 15Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support YesOpera Android Full support 14Safari iOS Full support YesSamsung Internet Android Full support Yes
createContextualFragment
Experimental
Chrome Full support YesEdge Full support 12Firefox Full support YesIE Full support 11Opera Full support 15Safari Full support 9WebView Android Full support YesChrome Android Full support YesFirefox Android Full support YesOpera Android Full support 14Safari iOS Full support YesSamsung Internet Android Full support Yes
deleteContentsChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
detachChrome Full support Yes
Notes
Full support Yes
Notes
Notes Since April 2014 this method is a no-op in Chrome.
Edge Full support 12Firefox No support 4 — 15
Notes
No support 4 — 15
Notes
Notes Starting in Firefox 15.0, this method is a no-op and has no effect.
IE Full support 9Opera Full support 9Safari Full support Yes
Notes
Full support Yes
Notes
Notes Since August 2015 this method is a no-op in WebKit-based browsers.
WebView Android Full support YesChrome Android Full support YesFirefox Android No support 4 — 15
Notes
No support 4 — 15
Notes
Notes Starting in Firefox 15.0, this method is a no-op and has no effect.
Opera Android Full support YesSafari iOS Full support Yes
Notes
Full support Yes
Notes
Notes Since August 2015 this method is a no-op in WebKit-based browsers.
Samsung Internet Android Full support Yes
endContainerChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
endOffsetChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
extractContentsChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
getBoundingClientRect
Experimental
Chrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 15Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support 14Safari iOS Full support YesSamsung Internet Android Full support Yes
getClientRects
Experimental
Chrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 15Safari Full support 5WebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support 14Safari iOS Full support YesSamsung Internet Android Full support Yes
insertNodeChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support 10.1Safari iOS Full support YesSamsung Internet Android Full support Yes
intersectsNode
Experimental
Chrome Full support YesEdge Full support 17Firefox Full support 17IE No support NoOpera Full support 15Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 19Opera Android Full support 14Safari iOS Full support YesSamsung Internet Android Full support Yes
isPointInRange
Experimental
Chrome Full support YesEdge Full support 15Firefox Full support YesIE No support NoOpera Full support 15Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support YesOpera Android Full support 14Safari iOS Full support YesSamsung Internet Android Full support Yes
selectNodeChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
selectNodeContentsChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
setEndChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
setEndAfterChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
setEndBeforeChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
setStartChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
setStartAfterChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
setStartBeforeChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
startContainerChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
startOffsetChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
surroundContentsChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
toStringChrome Full support YesEdge Full support 12Firefox Full support 4IE Full support 9Opera Full support 9Safari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes

Legend

Full support
Full support
No support
No support
Experimental. Expect behavior to change in the future.
Experimental. Expect behavior to change in the future.
Non-standard. Expect poor cross-browser support.
Non-standard. Expect poor cross-browser support.
Deprecated. Not for use in new websites.
Deprecated. Not for use in new websites.
See implementation notes.
See implementation notes.

See also