Range: Range() コンストラクター

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017.

Range() コンストラクターは、グローバルな Document オブジェクトを始点および終点とする、新しく作成された Range オブジェクトを返します。

構文

js
new Range()

引数

なし。

例

この例では、 Range() コンストラクターで新しい範囲を作成し、 Range.setStartBefore() メソッドと Range.setEndAfter() メソッドを使用してその開始位置と終了位置を設定します。そして、 window.getSelection() と Selection.addRange() を使用して範囲を選択します。

HTML

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

JavaScript

js
const paragraphs = document.querySelectorAll("p");

// 新しい範囲を作成
const range = new Range();

// 範囲を 2 つ目の段落から開始
range.setStartBefore(paragraphs[1]);

// 範囲を 3 つ目の段落で終了
range.setEndAfter(paragraphs[2]);

// window の選択範囲を取得
const selection = window.getSelection();

// window の選択範囲に範囲を追加
selection.addRange(range);

結果

仕様書

Specification
DOM Standard
# ref-for-dom-range-range②

ブラウザーの互換性

BCD tables only load in the browser

関連情報