正确更新HTML数据属性,但页面上未显示更改

Question

我有这个HTML:

<input type="text" id="query" data-source="whatever">

我有一些jQuery成功地更改了数据属性,即"无论"更改为"测试"

$(function() {
    $('#query').data('source', 'test');
    console.log($('#query').data());
});

但如果我使用Chrome检查页面,则元素中的数据属性尚未更新..我可以在控制台中打印它,但我无法检查新值!非常困惑.有任何想法吗？

这是小提琴

Answer 1

数据不存储在元素上(使用attr或prop).相反,jQuery在$ .cache中维护它.