添加槽數據屬性jquery無法選擇元素

我有以下的html代碼。添加槽數據屬性jquery無法選擇元素

<ul> 
    <li data-details="li1">first</li> 
    <li >second</li> 
</ul>

注意，對於第一元素i具有添加data-details屬性具有值。對於第二個li元素，我使用jquery添加相同的元素。這是我的JavaScript代碼。

$(document).ready(function() 
        { 
         $("ul li:nth-child(2)").data("details","li2"); 
         console.log($("ul li:nth-child(2)").data()); //data can be verified using this 
         alert($("ul li[data-details=li1]").length); //resulting in alert 1 
         alert($("ul li[data-details=li2]").length); //resulting in alert 0 
        });

我們可以通過檢查控制檯來驗證數據。不過，我無法根據jquery添加的data-details的值選擇元素。爲什麼會這樣呢？

，並在這裏與.data()不屬性設置的jsfiddle link

來源

2013-05-09 wh0

[jQuery Data vs Attr？]的可能重複（http://stackoverflow.com/questions/7261619/jquery-data-vs-attr） – undefined 2013-05-09 04:17:51

http://stackoverflow.com/questions/2891452/jquery-data -selector – undefined 2013-05-09 04:20:27

設置項目。如果您在HTML中設置屬性或使用類似.attr()的內容，則可以使用屬性選擇器。如果你需要找到一個有自己.data()集合中的元素，你需要使用.filter()：

var el = $("selector").filter(function() { 
    return typeof $(this).data("whatever") !== undefined; 
}); 
console.log(el.length);

注意，這是不以相反的方式相同的行爲。當您在HTML或.attr()中設置屬性時，任何data-*屬性將自動通過jQuery放入.data()。

DEMO：http://jsfiddle.net/zTsS4/2/

注意如何在演示中，屬性在HTML設置一個<li>，另設置有.data()。然後.filter()找到兩者。

來源

2013-05-09 04:17:54 Ian

添加槽數據屬性jquery無法選擇元素

回答

相關問題