Text.splitText()

Text.splitText() メソッドは、 Text ノードを指定したオフセットで二つに分割し、両方のノードを兄弟としてツリーの中に保持します。

分割後、現在のノードには指定したオフセット位置までのすべてのコンテンツが設定され、新規作成された同じ種類のノードには残りのテキストが設定されます。新しく作成されたノードは呼び出し元に返されます。元のノードに親があった場合、新しいノードは元のノードの次の兄弟として挿入されます。オフセットが元のノードの長さと等しい場合、新しく作成されたノードにはデータがありません。

分割されたテキストノードは、 Node.normalize() メソッドを用いて結合することができます。

構文

newNode = textNode.splitText(offset)

引数

offset: テキストノードを分割する直前の位置。

<p>foobar</p>

JavaScript

const p = document.querySelector('p');

// <p> の中身をテキストノードとして取得
const foobar = p.firstChild;

// 'foobar' を二つのテキストノード 'foo' と 'bar' に分割し、
// 'bar' を const として保存
const bar = foobar.splitText(3);

// <u> 要素を作成して ' new content ' を含める
const u = document.createElement('u');
u.appendChild(document.createTextNode(' new content '));

// <u> を 'bar' の前に追加
p.insertBefore(u, bar);

// 結果: <p>foo<u> new content </u>bar</p>

結果

仕様書

仕様書	状態	備考
DOM Text.splitText の定義	現行の標準	Document Object Model (DOM) Level 3 Core Specification から変更なし。
Document Object Model (DOM) Level 3 Core Specification Text.splitText の定義	廃止	Document Object Model (DOM) Level 2 Core Specification から変更なし。
Document Object Model (DOM) Level 2 Core Specification Text.splitText の定義	廃止	Document Object Model (DOM) Level 1 Specification から変更なし。
Document Object Model (DOM) Level 1 Specification Text.splitText の定義	廃止	初回定義

ブラウザーの互換性

BCD tables only load in the browser

Text.splitText()

構文

引数

返値

例外

例

HTML

JavaScript

結果

仕様書

ブラウザーの互換性

関連情報