Range()

This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The Range() constructor returns a newly created Range object whose start and end is the global Document object.

Syntax

range = new Range()

Example

In this example we create a new range with the Range() constructor, and set its beginning and end positions using the Range.setStartBefore() and Range.setEndAfter() methods. We then select the range using window.getSelection() and Selection.addRange().

HTML

<p>First paragraph.</p>
<p>Second paragraph.</p>
<p>Third paragraph.</p>
<p>Fourth paragraph.</p>

JavaScript

const paragraphs = document.querySelectorAll('p');

// Create new range
const range = new Range();

// Start range at second paragraph
range.setStartBefore(paragraphs[1]);

// End range at third paragraph
range.setEndAfter(paragraphs[2]);

// Get window selection
const selection = window.getSelection();

// Add range to window selection
selection.addRange(range);

Result

Specification

Specification Status Comment
DOM
The definition of 'Range.Range()' in that specification.
Living Standard Initial definition.

Browser compatibility

DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
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

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.

See also