jQueryのappendパターン
appendで追加するあれやこれのパターン。別に珍しいことないですよくある光景です。appendだけじゃなくてhtmlとかafterとかそゆのでも使えます。まあ何で使えるかっていうのはjQueryのドキュメント見てください
jQueryオブジェクト
まあ普通はこれですよ。
var hoge = $("#hoge");
$("#fuga").append(hoge);
とか極端な例だけど
$("#hoge").append(
$("<div></div>")
.append(
$("<a></a>")
.attr("href", fuga)
.text(piyo)
)
);
みたいなの
HTML要素
これもあるある。
$("#hoge").append(
"<div>fugafuga</div>"
);
HTML要素少し多い場合
ちょっと見にくい。
$("#hoge").append(
"<div class='fuga'>\
<h3>piyo</h3>\
<p>fungaaaaaaa</p>\
</div>"
);
上のパターンを配列で
割とみやすい。
$("#hoge").append([
"<div class='fuga'>",
"<h3>piyo</h3>",
"<p>fungaaaaaaa</p>",
"</div>"
].join(""));
functionで要素を返す
これあんまり使ってないと思いますけど超便利なんですよ。
中でたくさん作ってまとめて返したり、条件分岐で返したり夢が広がります。
$("#hoge").append(function() {
var elm = $("<ul></ul>"), li = [];
for ( var i = 0; i < l; i++ ) {
li.push(
"<li>" + fuga + "</li>"
);
}
return elm.append(li.join(""));
});
そんな感じで
最後のやつも積極的に使うといいと思います。
