Question

我想通过使用jQuery.data

链接来创建新元素并同时创建数据属性

所以在这里的例子中我想创建：

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

我试过了：

$("<div>").data(this, 'test','test').append('test').appendTo('body');

没有成功，有可能吗？

这里有fiddle可以播放

Answer 1

您还可以在同一个函数调用中为新创建的元素设置属性（和内容）：

$( '<div>', { 
  'data-test': 'test',
  'text': 'test'
} ).appendTo( 'body' );

此代码应该产生类似于此的内容：

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

Answer 2

.data的数据设置变体只接受两个参数，一个键和一个值（而数据获取变量只接受一个参数）。删除您的第一个参数.data。

$("<div>").data('test','test').append('test').appendTo('body');

请注意，jQuery的data未设置data-属性;它将值存储在内部查找表中，该查询表可通过数据获取.data调用访问。如果您确实需要设置data-属性（例如，为了与其他需要的非jQuery代码兼容），您可以使用.attr显式设置它：

$("<div>").attr('data-test','test').append('test').appendTo('body');

请注意，.data变体可以存储任意值（因为它使用内部字典），而.attr解决方案只能存储字符串（因为它使用属性值）。

Answer 3

.data()只需要2个参数，键和值：http://api.jquery.com/data/

$("<div>").data('test','test').append('test').appendTo('body');