備忘録的プログラミングリファレンス

append() メソッド

Element.append()

 append()メソッドは、Element を web ページに追加し表示するメソッドです。このメソッドの引数には複数の Node または DOMString の内容を使用でき、子エレメントとして最後尾に追加されます。

append() メソッドによる追加
var element_ = document.getElementById('example').append( 'Hello!' );

詳しくは Example を参照してください

 追加エレメントは最後の子エレメントの後に追加されます。子エレメントがない場合は、追加エレメントが最初になります。
 このメソッドの引数は1つの Node オブジェクトだけでなく、複数の Node オブジェクトまたはテキストが指定が可能です。テキストは DOMString に変換されます。

ページ内 Index

append() メソッドについて

 append() メソッドは、エレメントを追加表示するメソッドです。引数に複数のエレメントを指定することができます。

 引数が複数ある場合はカンマ,で区切ります。

append() メソッドによる追加
var element_ = document.getElementById('example').append( 'Hello!','example test', document.createElement("p",{id:"id_"}) );

 テキストは DOMString オブジェクトに変換されます。JavaScript での String オブジェクトです。テキストは自動で toString() メソッドで変換されます。

 既存のオブジェクトは指定された Element の子エレメントとして移動します。

 似たメソッドに、Node.appendChild() があります。Node.appendChild() は 1つの Node オブジェクトのみを引数にとります。
 他にコンテンツを追加する方法には、innerTextinnerHTML プロパティを利用する方法があります。簡易に更新や追加ができますが、オブジェクトへの変換がうまく行かないことがあります。

 append() メソッドには、Document オブジェクトのメソッドとしての Document.append() があります。こちらは Document が空でない場合はエラーになることがありますので注意して下さい。

構文(Syntax)

in JavaScript

返り値はないです。

Element.append( Nodes or Text );

引数(Parameter Values)

Value摘要
Nodes複数の Node オブジェクトが指定可能。カンマ,で区切る
TextDOMString 型のテキスト。Node オブジェクトとの組み合わせも可能

返り値(Return Values)

 返り値はないです。

Example