jquery，将对象(而不是字符串属性)附加到元素

Question

我正在尝试使用 jQuery 构建 DOM 并用 AJAX 接收的数据(数据类型 = json)填充它。我还想将此数据存储为对象，附加到特定的 DOM 元素。 jQuery 是否为此提供了任何方法？我想这样做的原因是因为最初只显示部分数据；稍后可能需要其他数据，具体取决于用户操作。

我尝试使用 attr()，但它存储字符串“[object Object]”而不是实际对象:

var div = $('<div/>');
div.attr('foo', {bar: 'foobar'});
alert(div.attr('foo')); // gives "[object Object]"
alert(typeof div.attr('foo')); // gives "string"
alert(div.attr('foo').bar); // gives "undefined"

另一种方法是“绕过”jQuery (div[0].foo = {bar: 'foobar'};)，尽管这似乎是一个“肮脏的解决方法” ，如果 jQuery 恰好已经支持附加对象。

有什么想法吗？提前致谢!

Answer 1

您可以使用.data()为此目的，如下所示:

div.data('foo', { bar: 'foobar' }); //sets it
var obj = div.data('foo'); //gets it

You can see your example code working here just by changing .attr() to .data() :

var div = $('<div/>');
div.data('foo', {bar: 'foobar'});
alert(div.data('foo')); // gives "[object Object]"
alert(typeof div.data('foo')); // gives "object"
alert(div.data('foo').bar); // gives "foobar"​​​​​​​​​​​​​​