Element.after()

Element.after() は、一連の Node または DOMString オブジェクトをこの Element の親の子リストの、 Element の直後に挿入します。 DOMString オブジェクトは Text ノードと等価なノードとして挿入されます。

構文

after(... nodes)

引数

nodes

挿入する一連の Node または DOMString オブジェクトです。

例外

HierarchyRequestError DOMException

ノードが階層構造の中の指定された位置に挿入できなかったときに発生します。

例

要素の挿入

let container = document.createElement("div");
let p = document.createElement("p");
container.appendChild(p);
let span = document.createElement("span");

p.after(span);

console.log(container.outerHTML);
// "<div><p></p><span></span></div>"

テキストの挿入

let container = document.createElement("div");
let p = document.createElement("p");
container.appendChild(p);

p.after("Text");

console.log(container.outerHTML);
// "<div><p></p>Text</div>"

要素とテキストの挿入

let container = document.createElement("div");
let p = document.createElement("p");
container.appendChild(p);
let span = document.createElement("span");

p.after(span, "Text");

console.log(container.outerHTML);
// "<div><p></p><span></span>Text</div>"

仕様書

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

ブラウザーの互換性

BCD tables only load in the browser

関連情報