jQuery .data（）不更新DOM

看來jQuery 1.7.2並沒有爲我更新DOM數據屬性。鑑於以下標記：jQuery .data（）不更新DOM

<ul id="foo"> 
    <li data-my-key="12345">ABCDEF</li> 
</ul>

運行的JavaScript下面，我得到一些結果我不期待：

$('#foo li:first').data('my-key') // Returns 12345 - Expected 
$('#foo li[data-my-key="12345"]') // Returns the expected <li> 
$('#foo li:first').data('my-key', '54321') 
$('#foo li:first').data('my-key') // Returns 54321 - Expected 
$('#foo li[data-my-key="54321"]') // Returns an empty array - Not expected

經進一步調查，我發現在DOM 不設置後已被修改使用.data（）函數的新值（在Chrome 21.0.1180.81，Firebug 1.10.3和Firefox 14.0.1中使用「Inspect Element」進行驗證）。

從我的預期來看，這種行爲是意想不到的，但這是jQuery數據運行的預期方式嗎？如果是這樣，用jQuery更新data- *屬性的適當方法是什麼？只需使用attr（）函數？

來源

2012-09-07 senfo

HTTP：/ /stackoverflow.com/questions/12271362/writing-in-a-new-attribute-and-making-it-active-in-jquery-1-7-using-document/12271393#12271393 –

@JosephSilber ehhh我真的沒有像你的答案那裏... – Neal

@Neal - 呃......好的。爲什麼？ –

$('#foo li[data-my-key="54321"]')是屬性選擇器。

使用.data(..)更改元素屬性如果不使用過濾器，則無法選擇該元素。

如果你想獲得所有的具有一定屬性的元素，你可以做到這一點（使用filter(...)）：

$('#foo li').filter(function(index) { 
    return $(this).data('my-key') === 54321; 
}); //returns all `#foo li` with data[my-key] === 54321

這裏看到更多的信息：.prop() vs .attr()

來源

2012-09-07 15:18:59 Neal

爲什麼不直接使用prop（）？ –

@DanielRuf'prop'直接做什麼？ – Neal

元素（與.attr（）相同的語法）http://api.jquery.com/prop/他需要過濾嗎？ –

jQuery .data（）不更新DOM

回答

相關問題