首頁猿問 jQuery...

jQuery .data（）不起作用，但.attr（）可以

JQuery

哆啦的時光機 2019-07-30 15:11:25

jQuery .data（）不起作用，但.attr（）可以原諒我沒有更具體的這一點。我有這么奇怪的錯誤。在doc加載之后，我循環(huán)了一些原來的元素data-itemname=""，并使用它來設置這些值.attr("data-itemname", "someValue")。問題：當我后來循環(huán)通過這些元素時，如果我這樣做elem.data().itemname，我會得到""，但如果我這樣做elem.attr("data-itemname")，我會得到"someValue"。這就像jQuery的.data()getter只獲取最初設置為包含某些值的元素，但如果它們最初是空的，稍后設置，則稍后.data()不會獲得該值。我一直試圖重新創(chuàng)建這個bug，但一直沒能。編輯我重新創(chuàng)建了這個bug！http://jsbin.com/ihuhep/edit#javascript,html,live另外，鏈接上面的片段......JS：var theaters = [ { name: "theater A", theaterId: 5 }, { name: "theater B", theaterId: 17 }];$("#theaters").html( $("#theaterTmpl").render(theaters));// DOES NOT WORK - .data("name", "val") does NOT set the valvar theaterA = $("[data-theaterid='5']");theaterA.find(".someLink").data("tofilllater", "theater5link"); // this does NOT set data-tofilllater$(".someLink[data-tofilllater='theater5link']").html("changed link text"); // never gets changed// WORKS - .attr("data-name", "val") DOES set valvar theaterB = $("[data-theaterid='17']");theaterB.find(".someLink").attr("data-tofilllater", "theater17link"); // this does set data-tofilllater$(".someLink[data-tofilllater='theater17link']").html("changed link text");HTML：<body> <div id="theaters"></div></body><script id="theaterTmpl" type="text/x-jquery-tmpl"> <div class="theater" data-theaterid="{{=theaterId}}"> <h2>{{=name}}</h2> <a href="#" class="someLink" data-tofilllater="">need to change this text</a> </div></script>

查看完整描述

3 回答

拉丁的傳說

TA貢獻1789條經(jīng)驗獲得超8個贊

幾天前，當我使用.data()和.attr('data-name')處理HTML5數(shù)據(jù)屬性時，我遇到了類似的“bug” 。

您描述的行為不是錯誤，而是設計。

該.data()調(diào)用是特殊的 - 它不僅檢索HTML5數(shù)據(jù)屬性，還嘗試評估/解析屬性。因此，使用像data-myjson='{"hello":"world"}'檢索到的屬性.data()將返回一段Object時間檢索通過.attr()將返回一個字符串。參見jsfiddle示例。

因為.data()額外的處理jQuery存儲了屬性評估的結果$.cache- 畢竟，一旦評估了數(shù)據(jù)屬性，在每次.data()調(diào)用時重新評估將是浪費- 特別是因為數(shù)據(jù)變量可以包含復雜的JSON字符串。

我說了以下所有內(nèi)容：通過后續(xù)調(diào)用后不會看到的任何更改檢索屬性后。.data().attr('data-myvar', '').data() 在jsfiddle上測試一下。

為了避免這個問題，請不要混合.data和.attr()調(diào)用。使用其中一個。

反對回復 2019-07-30