使用数据属性创建div

ily*_*lyo 24 javascript jquery

我按以下方式创建div

$('<div/>', {
    "class" : 'draggable player' + player + ' unit unit' + unit
})
Run Code Online (Sandbox Code Playgroud)

而且我找不到我可以分配给它的其他属性,就像我分配类一样.特别是如果我可以分配dataattr

Bra*_*lly 36

根据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" });
Run Code Online (Sandbox Code Playgroud)

将创建此元素,并返回包含它的jQuery对象:

<div data-test="Testing"></div>
Run Code Online (Sandbox Code Playgroud)

从那里,您将能够:

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

当然,$elem.attr('data-test')也会奏效.

  • 使用`$`前缀JS变量是识别jQuery对象的常见做法. (2认同)

Jos*_*ber 12

您可以指定所需的任何属性:

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

这是小提琴:http://jsfiddle.net/vCaym/