javascript - 使用 html jQuery 对象时 jQuery .data 不起作用

Question

我在使用 HTML jQuery 对象的 .data jQuery 函数时遇到问题。

var test = $('<div><div class="abc123"></div></div>');
test.find('.abc123').data('please', 'change');

和test仍然没有改变

<div>
    <div class="abc123"><div>
</div>

但是使用.text函数

test.find('.abc123').text('TESTING');

工作正常:

<div>
    <div class="abc123">TESTING</div>
</div>

有没有办法让data在test变量上工作？

<小时/>

编辑:

运行后我期待什么

test.find('.abc123').data('please', 'change');

是

<div>
    <div class="abc123" data-please="change"></div>
</div>

Answer 1

在元素上调用 .data()，无论是在 HTML 中还是在 JQuery 对象中创建，都不会修改关联的标记。无论如何，关联的 DOM 属性都会更新。

var test = $('<div><div class="abc123"></div></div>');
test.find('.abc123').data('please', 'change');

alert(test.find('.abc123').data('please'));

上面的代码将提醒“更改”。

如果您的目标还包括更新标记，则可以使用:

test.find('.abc123').attr('data-please', 'change');