DOM

インターフェイス

AbstractRange インターフェイス

→●、MS

AbstractRange 抽象インターフェースは、すべてのDOM範囲タイプが定義される基本クラスです。範囲は、ドキュメント内のコンテンツのセクションの開始点と終了点を示すオブジェクトです。

注： 抽象インターフェースとして、AbstractRange型のオブジェクトを直接インスタンス化することはありません。代わりに、Range または StaticRange インターフェースを使用します。これら 2 つのインターフェースの違いと、ニーズに適したインターフェースを選択する方法を理解する。

プロパティ

AbstractRange.collapsed 読取専用 ●

範囲が折りたたまれている場合に true となるブール値。折りたたまれた範囲は、開始位置と終了位置が同じである範囲であり、結果としてゼロ文字の長さの範囲になります。

AbstractRange.endContainer 読取専用 ●

endOffsetプロパティで指定された範囲の終わりが、位置しています。

AbstractRange.endOffset 読取専用 ●

オフセットを示す整数値、文字単位で、ノードのコンテンツの先頭から範囲オブジェクトによって表される範囲の先頭まで。この値は、endContainerノードの長さよりも小さくする必要があります。

AbstractRange.startContainer 読取専用 ●

startOffsetプロパティで指定された範囲の開始が含まれるDOMノード、位置しています。

AbstractRange.startOffset 読取専用 ●

オフセットを示す整数値、文字単位で、ノードのコンテンツの先頭から範囲オブジェクトによって参照されるコンテンツの最後の文字まで。この値は、startContainerに示されているノードの長さよりも小さくする必要があります。

メソッド

AbstractRangeインターフェースは、任意のメソッドを提供します。

使用上の注意

範囲タイプ

ドキュメント内のすべてのコンテンツ範囲は、AbstractRange に基づくインターフェイスのインスタンスを使用して記述されます。そのようなインターフェースは 2 つあります：

Range

Rangeインターフェースは長い間使用されてきましたが、他の形式の範囲データを定義する必要が生じたため、AbstractRangeに基づくように最近再定義されました。 Rangeは、範囲のエンドポイントを変更できるメソッドを提供します。範囲を比較する方法と同様に、範囲間の交差を検出し、などなど。

StaticRange

StaticRange は基本的な範囲であり、一度作成すると変更できません。具体的には、ノード ツリーが変化して変化しても、範囲は変化しません。これは、1 回だけ使用される範囲を指定する必要がある場合に役立ちます。これは、より複雑な Range インターフェイスのパフォーマンスとリソースへの影響を回避するためです。

要素の内容

要素のコンテンツにアクセスしようとするときは、要素自体がノードであることに注意してください。しかし、その中のテキストもそうです。要素のテキスト内に範囲エンドポイントを設定するには、要素内のテキストノードを必ず見つけてください。

let startElem = document.querySelector("p");
let endElem = startElem.querySelector("span");
let range = document.createRange();

range.setStart(startElem, 0);
range.setEnd(endElem, endElem.childNodes[0].length/2);
let contents = range.cloneContents();

document.body.appendChild(contents);

この例では、新しい範囲、範囲を作成し、その開始点を、クラスが elementclass である最初の要素の 3 番目の子ノードに設定します。終点はスパンの最初の子の中央に設定され、範囲は範囲の内容をコピーするために使用されます。

¶省く

テスト