通过存储的数据获取jQuery元素

Question

使用.data()函数，我们可以将数据存储在jQuery对象中：

来自documentation：

  

存储与匹配元素关联的任意数据，或者在指定数据存储中返回匹配元素集中第一个元素的值。

示例：

 // sets "string" value to "test"
 $(".myClass").data("test", "string");

 $(".myClass").data("test"); // returns "string"

这很简单。

现在我想从页面获取"string"值与"test"相关联的所有jQuery元素。

这可能吗？是否有任何功能可以做到这一点？

Answer 1

您可以使用.filter()过滤元素

var $filtered = $('<target-elements>').filter(function(){
    return $(this).data('test') == 'test'
})

演示：Fiddle

Answer 2

我很害怕.data()实际上没有为你的html元素添加data-属性。 一种可能的解决方法是迭代元素：

$('.myClass').each(function(){
    var el = $(this);
    if(el.data("test") === "string") {
        console.log("found !");
    }        
});

这是一个小提琴：

http://jsfiddle.net/5p9LX/1/

Answer 3

尝试使用jQuery.grep()过滤所有元素

使用'test'数据键获取所有元素：

var arrElements = $.grep($("*"), function (a) { return $(a).data("test") != undefined; });
var $filteredElements = $(arrElements);

获取所有带有'test'数据值的元素等于'string'：

var arrElements = $.grep($("*"), function (a) { return $(a).data("test") == "string"; });
var $filteredElements = $(arrElements);