jQueryでinput要素をつくり込む

「jQueryを使ってフォーム要素を創り上げていく」って言うのが必要になり、調べてみたら結構簡単に行けた！

忘れないようにメモメモ...

jQueryはjQuery("CSS Selector"[, Context])のような形で「要素を抽出」出来ますが、こんな方法も。

jQuery("<input>", { attributes });

これで、input要素の属性（typeとかname属性など）をガシガシ付け足すことができるみたいです。

バージョンによって（1.3.2以前と1.4以降からが境っぽい...）書き方が異なるようなので注意！

参考URL：http://idocsq.net/page/224

これを利用すると、XMLなどからフォームを動的生成なんてこともできそう。

例えば

<hoge>
    <field type="text" value="test" name="sample" label="hige?" />
</hoge>

のようなXMLなら

$.ajax({
    url: "/path/to/xml.xml",
    dataType: "xml",
    type: "GET",
    success: function(xml) {
        var $field = $(xml).find("field");
        $("<input>", {
            "type": $field.attr("type"),
            "value": $field.attr("value"),
            "name": $field.attr("name"),
            "id": "sample"
        })
        .after("<label />", {
            "for": "sample",
            text: $field.attr("label")
        });
    }
});

のような形で。

元XMLの構成をちゃんと練らないと厳しいですが、これはこれで使えそうな感じが。

jQuery素敵です...。