如何获取由JQuery.data（）创建的具有特定数据属性的元素？

Question

我知道JQuery已经有选择带有data属性的元素的方法，看起来像

$("[data-attr='value']")

但是，如果您使用类似JQuery.data（）的方法将数据放入HTML元素

$("button").data("attrName", "attrValue");

代替

$("button").attr("attrName", "attrValue");

您不会真正得到

<button data-attrName="attrValue"> </button>

因此，您不能使用

$("button[data-attrName='attrValue']")

获取此按钮。

因此，作为标题。 有什么方法可以选择由JQuery.data（）创建的具有特定数据属性的元素吗？

Answer 1

如果data属性是通过jQuery的data()方法添加的，则它在DOM中将不可用，因此属性选择器将无法工作-如您所知。

替代方法是使用filter()，如下所示：

var $button = $('button').filter(function() {
  return $(this).data('attrName') == 'attrValue';
});