使用jQuery选择具有特定数据的元素

Question

使用jQuery data方法设置一些数据，然后以后查询它是否可能？例如...查找所有具有数据foo == true的元素？

- tok

Answer 1

你可以使用.filter（）来选择你想要的元素，像这样：

$("someSelector").filter(function() { return $.data(this, "foo"); });

在这种情况下，因为你正在检查一个布尔值，所以非常简单。如果要检查某个值，请添加比较运算符，就像这样：

$("someSelector").filter(function() { return $.data(this, "foo") == "value"; });

- Nick Craver

---

使用 $.data(this, 'foo') 相对于 $(this).data('foo') 有什么优势？ - Matt Ball

@Matt - 不浪费 jQuery 对象 :) - Nick Craver

这对我没有用。我不明白为什么你要为我评估$.data(this, "foo") == "value"，我将其替换为$.data(this).foo.id == "idValue"后它就可以用了。无论如何，谢谢你的提示！确实帮了我很大的忙！ - Xeroxoid

@Xeroxoid - 在你的情况下，你是在检查foo上的id属性，而不仅仅是foo。为了进行比较，在我的例子中，你需要使用$.data(this, "foo").id而不仅仅是$.data(this, "foo")来进行等价比较。 - Nick Craver

我的文档正在使用HTML5 data-foo属性，如果我在加载时使用您的示例，它不起作用，但是$(this).data('foo')可以正常工作。奇怪的是，在"select"元素上，当选择的值改变时它开始起作用。 - arnaslu

@steelaz - 上述方法只有在元素存储了数据时才有效...数据属性的处理方式不同，必须通过.data('name')访问(至少第一次)，该方法会查看属性，而$.data(obj,'name')仅直接查看jQuery中存储的数据对象。 - Nick Craver

Answer 2

仅使用data API 无法实现，需要通过遍历DOM中的每个元素并检查其是否包含特定值的数据项。

如果数据很简单，可能可以使用HTML5数据属性，这些属性还可以通过选择器进行搜索。

$("selector").attr("data-key", "theKey");

稍后使用以下代码选择所有具有名为"data-key"且值为true的属性的对象：

$('[data-key="true"]')

- Anurag

---

非常感谢。我忘记了jQuery并不总是将这些数据保存在元素中 :) - e382df99a7950919789725ceeec126