jQueryトリビアルメモ４　要素の追加

最近ボールペンのキャップを閉め損ねて指が青色になって行きます。

javascriptでDOMの要素を追加するにはdocument.createElement()ですよね。

var div = document.createElement("div");
document.body.addChild(div);

jQueryでやるにはどうしたらええのか。最初分からんかったとです。まあ、ひとつには上記のやり方で追加するってのもありです。追加したものもjQueryで使えます。しかしまあ、なんとなくやりたくない。単にタグを追加するには

$("#hoge").append('<a href="http://www.google.com">google</a>');

で子要素に追加できるし、

$("#hoge").appendTo('<a href="http://www.google.com">google</a>');

で後ろに追加できるし、

$("#hoge").before('<a href="http://www.google.com">google</a>');

で前に追加できる。でもこんなことしたら属性をいじれないし、なによりDOMっぽくない。戻り値に追加した要素が入ってくるわけでもない。
でもどうやら$(“<foo>”)でfooタグを追加できるっぽい。そういうわけで以下のように書ける。

$("#hoge").before(
                  $("<a>").attr("href", "http://www.google.com").html("google")
               );

“<a>”でも”<a/>”でもいけた。

以上