CharacterData: after() メソッド

Baseline Widely available

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

after()CharacterData インターフェイスのメソッドで、一連の Node オブジェクトまたは文字列を、このオブジェクトの親ノードの子リスト内の、このオブジェクト自身の直後に挿入します。

文字列は Text ノードとして挿入されます。文字列は Text() コンストラクターの引数として挿入されます。

構文

js
after(...nodes)

引数

nodes

挿入する一連の Node または文字列です。

例外

HierarchyRequestError DOMException

階層内の指定された位置に新しいノードを挿入できない場合,つまり以下の条件のいずれかに該当する場合に発生します。

after() メソッドを使うと、新しいノードをこの CharacterData ノードの後に挿入することができます。

js
const h1TextNode = document.querySelector("h1").firstChild;
h1TextNode.after(" #h1");

h1TextNode.parentElement.childNodes;
// NodeList [#text "CharacterData.after()", #text " #h1"]

h1TextNode.data;
// "CharacterData.after()"

メモ: 現在のノードにテキストを追加したい場合は、 appendData() メソッドを使用すると現在のノードにデータを追加することができます。

仕様書

Specification
DOM Standard
# ref-for-dom-childnode-after①

ブラウザーの互換性

BCD tables only load in the browser

関連情報