DOM

ドキュメント オブジェクト モデル

ParentNode.prepend() メソッド

 編集:2022.11.09 by T.A.

[Edge]。→mdn

ParentNode の最初の子ノードの前に指定の NodeDOMString オブジェクトを挿入します。

DOMString オブジェクトは、同等の Text ノードとして挿入されます。

構文
ParentNode.prepend(...nodes)
ParentNode ParentNodeDocumentDocumentFragmentElement)。
nodes NodeDOMString オブジェクト。複数指定の場合はカンマ「,」で区切って指定する。
戻り値

undefined。

例外
HierarchyRequestError
ノードを階層の特定の箇所に追加することができません。

要素の前に追加

let div = document.createElement("div");
let p = document.createElement("p");
let span = document.createElement("span");
div.append(p);
div.prepend(span);

console.log(div.childNodes); // NodeList [ <span>, <p> ]

HTML:

<SPAN id=IdTest>[SPAN要素]</SPAN>

JavaScript:

E=document.createElement('B'); //新しいB要素を生成。
E.innerText="[B要素]";         //それにテキストを設定。
IdTest.prepend(E, "テキスト"); //IdTestの最初の子ノードの前にB要素とテキストを挿入。
D=IdTest.outerHTML; //=[string]:<span id="IdTest"><b>[B要素]</b>テキスト[SPAN要素]</span>

テスト
HTML:


ここにHTMLが表示される
スクリプト組み込み:
JavaScript:


JavaScript:



表示内容:
表示内容: