Text.splitText()
メソッドは、 Text
ノードを指定したオフセットで二つに分割し、両方のノードを兄弟としてツリーの中に保持します。
分割後、現在のノードには指定したオフセット位置までのすべてのコンテンツが設定され、新規作成された同じ種類のノードには残りのテキストが設定されます。新しく作成されたノードは呼び出し元に返されます。元のノードに親があった場合、新しいノードは元のノードの次の兄弟として挿入されます。オフセットが元のノードの長さと等しい場合、新しく作成されたノードにはデータがありません。
分割されたテキストノードは、 Node.normalize()
メソッドを用いて結合することができます。
構文
newNode = textNode.splitText(offset)
引数
offset
- テキストノードを分割する直前の位置。
返値
新しく生成された Text
ノードを返し、指定されたオフセット位置移行のテキストが格納されます。
例外
DOMException
で値が INDEX_SIZE_ERR
のものは、指定されたオフセットが負の値であるか、ノードのテキストの16ビット単位の文字数よりも大きい場合に発生します。 DOMException
で値が NO_MODIFICATION_ALLOWED_ERR
のものは、ノードが読取専用の場合に発生します。
例
HTML
<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>
結果
仕様書
ブラウザーの互換性
BCD tables only load in the browser
このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 https://github.com/mdn/browser-compat-data をチェックアウトしてプルリクエストを送信してください。
関連情報
- 所属先の
Text
インターフェイス - 逆のメソッド:
Node.normalize