javascript - データ属性を使用してdivを作成する

Question

私は次の方法でdivを作成しています

$('<div/>', {
    "class" : 'draggable player' + player + ' unit unit' + unit
})

また、クラスを割り当てるのと同じ方法で、他にどのようなプロパティを割り当てることができるかがわかりません。特に私が割り当てることができるdataかattr？

Answer 1

jQuery()関数のドキュメント(のエイリアス) によると、$()その 2 番目のパラメーター内で属性、イベント、およびメソッドを定義できます。

そうです、あなたが定義するものは何でもattr()公正なゲームです。これには「data-whatever」属性(奇妙に 経由でアクセス可能) が含まれますが、経由で定義された変数のよう$elem.data('whatever')に保存されることはありません(少なくとも呼び出すまでは、 http://api.jquery.com/jQuery.data/を参照してください)。 #entry-longdesc-1 )。jQuery.data$elem.data('name', 'value')$elem.data('whatever')

明確にするために：

var $elem = jQuery('<div/>', { 'data-test': "Testing" });

この要素を作成し、それを含む jQuery オブジェクトを返します。

<div data-test="Testing"></div>

そこから、次のことができるようになります。

jQuery.data($elem[0], 'test'); // => undefined
$elem.data('test');            // => "Testing"
jQuery.data($elem[0], 'test'); // => "Testing"

もちろん、$elem.attr('data-test')動作もします。

Answer 2

必要な属性を割り当てることができます。

$('<div/>', {
    "class" : 'draggable player' + player + ' unit unit' + unit,
    "data-info": 'Anything you want',
    "even-non-validating-attributes": 'ANYTHING!!'
});

これがフィドルです：http://jsfiddle.net/vCaym/