jQuery不返回新的数据属性

Question

我正在尝试使用data-attr和jQuery进行非常简单的任务，请检查以下示例：

标记 ：

<div data-name="Testing"></div>

JS

$(function(){
    var div = $('div');
    $(div).append($(div).data('name'));
    $(div).attr('data-name', ' -  Testing 2');
    $(div).append($(div).data('name'));
    console.log(div);
});

您可以在这里进行测试： http : //jsfiddle.net/YsKJJ/16/

因此，应在div内附加文本Testing - Testing 2 ，但打印TestingTesting 。 在控制台中，我检查对象中的attr是否已更改，是的，具有新值- Testing 2但jQuery仍返回原始值:(

任何想法？

更新：

因此，根据jQuery文档这种行为的原因：

数据属性在第一次访问数据属性时被提取，然后不再被访问或变异（所有数据值然后内部存储在jQuery中）。

更多信息： jQuery Data vs Attr？

Answer 1

您正在更改属性，但这不会自动更新数据。 这有效：

$(function(){
    var div = $('div');
    div.append(div.data('name'));
    div.data('name', ' -  Testing 2');
    div.append(div.data('name'));
});

Answer 2

工作演示 http://jsfiddle.net/DDv8U/

• API： http : //api.jquery.com/data/-尝试使用此$(div).data('name', ' - Testing 2');

休息应该适合需要:)

码

$(function(){
    var div = $('div');
    $(div).append($(div).data('name'));
    $(div).data('name', ' -  Testing 2');
    $(div).append($(div).data('name'));
});