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() This is an experimental API that should not be used in production code.
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() This deprecated API should no longer be used, but will probably still work. This API has not been standardized.
Returns a constant representing whether the Node is before, after, inside, or surrounding the range.
Range.comparePoint() This is an experimental API that should not be used in production code.
Returns -1, 0, or 1 indicating whether the point occurs before, inside, or after the Range.
Range.createContextualFragment() This is an experimental API that should not be used in production code.
Returns a DocumentFragment created from a given string of code.
Range.getBoundingClientRect() This is an experimental API that should not be used in production code.
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() This is an experimental API that should not be used in production code.
Returns a list of DOMRect objects that aggregates the results of Element.getClientRects() for all the elements in the Range.
Range.intersectsNode() This is an experimental API that should not be used in production code.
Returns a boolean indicating whether the given node intersects the Range.
Range.isPointInRange() This is an experimental API that should not be used in production code.
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

BCD tables only load in the browser

See also