jquery - 由 jquery 更新的数据属性值在 DOM 中不可见

Question

我正在通过 jQuery 更新数据属性，例如：

jQuery('div').data('hidden', 'true');
alert(jQuery('div').data('hidden'));

数据属性值已更改并返回新值，true但 DOM 仍显示旧值，即false.

Answer 1

当你使用.data()更新一个数据值时，它是在更新 jQuery 管理的内部对象，所以它不会在data-*属性中更新

Answer 2

我在拐弯抹角:( 并且能够解决问题。如果 html 是动态的并且数据属性在第一次访问后发生更改，我们就无法使用 jquery 数据方法来实现这一点。

根据jQuery.data()

data- 属性在第一次访问 data 属性时被拉取，然后不再被访问或改变（然后所有数据值都存储在 jQuery 内部）。

所以我所做的是，将其更改为 attr 方法，该方法不会为您提供整数的解析值，因此您必须使用 '+' 操作数进行转换，如：

+ myElement.attr('data-index');

注意：你必须小心，如果数据属性中有任何字符串，它会将结果转换为 NaN。顺便说一句，这是您对代码实现的选择。