このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

Element: prepend() メソッド

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨2018年4月⁩.

Element.prepend() メソッドは、一連の Node または文字列をこの Element の最初の子の前に挿入します。文字列は、同等の Text ノードとして挿入されます。

構文

js
prepend(param1) prepend(param1, param2) prepend(param1, param2, /* …, */ paramN) 

引数

param1, …, paramN

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

返値

なし (undefined)。

例外

HierarchyRequestError DOMException

ノードを階層の指定された箇所に追加することができない場合に発生します。

要素の前に追加

js
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> ] 

テキストの前に追加

js
let div = document.createElement("div"); div.append("Some text"); div.prepend("Headline: "); console.log(div.textContent); // "Headline: Some text" 

要素とテキストの追加

js
let div = document.createElement("div"); let p = document.createElement("p"); div.prepend("Some text", p); console.log(div.childNodes); // NodeList [ #text "Some text", <p> ] 

prepend() メソッドはスコープが効かない

prepend() メソッドは with 文の中ではスコープが効きません。詳しくは Symbol.unscopables をご覧ください。

js
let div = document.createElement("div"); with (div) { prepend("foo"); } // ReferenceError: prepend is not defined 

仕様書

Specification
DOM
# ref-for-dom-parentnode-prepend①

ブラウザーの互換性

関連情報