Node.appendChild() メソッドは、特定の親ノードの子ノードリストの末尾にノードを追加します。追加しようとしたノードが既に存在していたら、それは現在の親ノードから除かれ、新しい親ノードに追加されます(他のノードに追加する前にそのノードを親ノードから削除する必要はありません)。

これは、ノードが同時にドキュメントの 2 箇所に存在できないということを意味します。ノードがすでに親を持っている場合、最初にノードが削除された後、新しい位置の末尾に追加されます。Node.cloneNode() は、新しい親の末尾に追加する前に、ノードのコピーを作成するために使用できます。cloneNode で作成したコピーは自動的に同期を保たないことに注意してください。

このメソッドでは、異なるドキュメント間でノードを移動することはできません。子どなるドキュメントからノードを末尾に追加したい場合は、document.importNode() メソッドを使用する必要があります。

構文

var aChild = element.appendChild(aChild);

戻り値は追加した子ノードです。

// 新しい段落要素を作成し、ドキュメントの body の最後に追加します。
var p = document.createElement("p");
document.body.appendChild(p);

仕様

仕様 ステータス コメント
DOM
Node.appendChild() の定義
現行の標準 Document Object Model (DOM) Level 3 Core Specification から変更なし。
Document Object Model (DOM) Level 3 Core Specification
Node.appendChild() の定義
勧告 Document Object Model (DOM) Level 2 Core Specification から変更なし。
Document Object Model (DOM) Level 2 Core Specification
Node.appendChild() の定義
勧告 Document Object Model (DOM) Level 1 Specification から変更なし。
Document Object Model (DOM) Level 1 Specification
Node.appendChild() の定義
勧告 初期定義。

ブラウザー実装状況

機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari
基本サポート (有) 1.0 (1.7 or earlier) (有) (有) (有)
機能 Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
基本サポート (有) 1.0 (1.0) (有) (有) (有)

関連情報

ドキュメントのタグと貢献者

 このページの貢献者: YuichiNukiyama, fscholz, khalid32, teoli, ethertank, Taken, Mgjbot, Ryotakano
 最終更新者: YuichiNukiyama,