jqueryselect所有具有$ jquery.data（）的元素

select我以前用jquery.data();设置的元素jquery.data();

即select已经设置了.data('myAttr')所有元素。

解

小聪明是小提琴

Answer 1

你可以做

 $('[data-myAttr!=""]'); 

这将select所有具有属性data-myAttr的不等于''的元素（所以它必须被设置）。

你也可以使用filter（）

 $('*').filter(function() { return $(this).data('myAttr') !== undefined; }); 

Answer 2

最好和简单的方法来select它们是：

 $('[data-myAttr]') 

更多信息：

我testing了很多东西。

使用$('[data-myAttr!=""]')不适用于所有情况。 因为没有设置data-myAttr元素，其data-myAttr等于undefined ， $('[data-myAttr!=""]')也会select这些，这是不正确的。

Answer 3

你可以使用filter（） ：

 var elements = $("*").filter(function() { return $(this).data("myAttr") !== undefined; }); 

Answer 4

你可以使用这个jQuery Selector扩展： 查询元素数据

 $(':data'); // All elements with data $(':not(:data)'); // All elements without data 

Answer 5

您可以使用JQuery UI ：data（）select器

select具有存储在指定键下的数据的元素。

检查这个jsfiddle的例子

要获得所有匹配.data('myAttr')元素，你可以使用

 var matches = $(':data(myAttr)'); 

这应该适用于具有data-属性的元素以及使用$.data()存储data-元素

从jQuery 1.4.3开始，HTML 5数据属性将被自动引入到jQuery的数据对象中。

但是这并不是很好。 检查这个jsfiddle ，你会看到第二次select器被调用它应该匹配2个元素，只匹配一个。 这是由于jquery-ui库中的“错误”。

这是从核心jquery-ui文件。

  $.extend( $.expr[ ":" ], { data: $.expr.createPseudo ? $.expr.createPseudo(function( dataName ) { return function( elem ) { return !!$.data( elem, dataName ); }; }) : // support: jQuery <1.8 function( elem, i, match ) { return !!$.data( elem, match[ 3 ] ); } }); 

正如你所看到的，他们正在使用$.data(elem, match)而不是$(elem).data(match) ，这会导致caching不被更新，以防您请求具有data-属性的元素。 如果该元素已经过data()存储testing，那么运行良好，但如果没有，则不会包含在结果匹配中。

这可能不是一个错误，如果你想要的只是与你设置的数据信息匹配的元素，但如果没有，你剩下两个选项。

1. 不要使用jquery-ui并扩展你自己的伪select器$(:mydata(myAttr))

    $.extend($.expr[":"], { mydata: $.expr.createPseudo ? $.expr.createPseudo(function(dataName) { return function(elem) { return !!$(elem).data(dataName); }; }) : function(elem, i, match) { return !!$(elem).data(match[3]); } }); 

     // pseudoselector code $.extend($.expr[":"], { mydata: $.expr.createPseudo ? $.expr.createPseudo(function(dataName) { return function(elem) { return !!$(elem).data(dataName); }; }) : function(elem, i, match) { return !!$(elem).data(match[3]); } }); // end pseudoselector testSelector = function() { var matched = $(':mydata(test)'), results = $('#results'); results.append('<div>You matched ' + matched.length + ' elements</div>'); matched.css('border', 'black 3px solid'); console.log(matched); console.log('You matched ' + matched.length + ' elements'); }; testSelector(); $('#addData').click(function() { $(".bar").data('test', 'value2'); testSelector(); }); 

     .foo { background-color: red; color: white; } .bar { background-color: blue; color: white; } #addData { margin-top: 20px; } 

     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div> <span class="bar">without data attribute</span> <span class="foo" data-test="value1">with data attribute</span> </div> <button id="addData" type="button">Add data</button> <div id="results"></div> 

Answer 6

 $('[data-myAttr]').each(function() { var element = $(this); // Do somting with element }); 

Answer 7

select我以前用jquery.data();设置的元素jquery.data();

---

问题是find所有具有特定键的元素，而不是任何数据。

---

尝试使用jQuery.data()

 $(".myClass").each(function(i){ if( i % 2 == 0 ){ $(this).data("myAttr",i + 1); } }); var res = $(".myClass").map(function(i) { console.log($(this).data("myAttr")); return $.data(this, "myAttr") !== undefined ? this : null }); console.log(res); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> </script> <div class="myClass">1</div> <div class="myClass">2</div> <div class="myClass">3</div> <div class="myClass">4</div> <div class="myClass">5</div>