Как получить элемент с определенным атрибутом данных, который создан JQuery.data ()?

Question

Я знаю, что в JQuery уже есть метод для выбора элементов с атрибутом данных, который выглядит как

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

Однако, если вы помещаете данные в элемент HTML с помощью метода JQuery.data (), например

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

вместо

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

Вы действительно не получите

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

Следовательно, вы не можете использовать

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

чтобы получить эту кнопку.

Итак, как заголовок. Есть ли способ выбрать элемент с определенным атрибутом данных, созданный JQuery.data ()?

Answer 1

Если атрибут data был добавлен с помощью метода data() в jQuery, он не будет доступен в DOM, следовательно, селекторы атрибутов не будут работать - как вы обнаружили.

Альтернативаиспользовать filter(), вот так:

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