javascript - 使用数据属性创建 div

Question

我正在通过以下方式创建 div

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

而且我找不到可以像分配类一样分配给它的其他属性。特别是如果我可以分配data或attr？

Answer 1

根据jQuery()函数文档（的别名$()），您可以在第二个参数中定义属性、事件和方法。

所以是的，你定义的任何东西attr()都是公平的游戏。这包括“data-whatever”属性（奇怪的是可以通过 访问$elem.data('whatever')），但是它们不会jQuery.data像通过定义的任何变量一样保存$elem.data('name', 'value')（至少在您调用之前$elem.data('whatever')- 请参阅http://api.jquery.com/jQuery.data/ #entry-longdesc-1）。

所以澄清一下：

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/