jQuery 基礎チュートリアル

jQuery エフェクト

append()メソッドを使用して、指定された内容を各選択された要素の末尾（最後の子要素として）に挿入します。

選択された要素の先頭に内容を挿入するには、prepend()メソッド。

挿入内容：

$(selector).append(content)

関数を使用して内容を挿入する：

$(selector).append(function(index,　html))

すべての段落にテキストを追加します：

例

$("button").click(function(){
　　$("p").append("Hello　world");
});

HTMLをすべての段落に挿入します：

例

$("button").click(function(){
　　$("p").append("<b>Hello　world</b>");
});

この例ではdocument.createTextNode()を使用してテキストノードを作成し、すべての<p>要素に挿入します：

例

$("button").click(function(){
　　$("p").append(document.createTextNode("Hello　world"));
});

関数を使用して内容を挿入する：

例

$("button").click(function(){
　　$("p").append(function(i){
　　　　　　　return "<b>このp要素はインデックスが"　+　i　+　".</b>";
　　});
});

パラメータ	説明
content	各選択された要素の末尾に挿入する内容を指定します（HTMLタグを含むことができます）可能な値： HTML要素 DOM要素 jQueryオブジェクト
function(index, html)	指定された関数を指定します。この関数は挿入する内容を返します index-要素が集合内のインデックス位置を返します html-選択された要素の現在のHTMLを返します