Имя атрибута jQuery содержит

Question

Я пытаюсь настроить таргетинг на имена атрибутов, которые содержат определенное слово, а не тем способом, которым вы думаете.

Допустим, я имею:

<div data-foo-bar="hello"></div>

КакЯ нацеливаюсь на элементы, которые имеют 'data-foo' в имени атрибута?

Answer 1

Я не думаю, что вы можете настроить таргетинг на имена атрибутов так же, как вы ориентируетесь на значения атрибутов.Однако вы можете использовать .filter(), чтобы сделать это несколько эффективнее:

$('div').filter(function() {
  for (var property in $(this).data()) {
    if (property.indexOf('fooBar') == 0) {
      return true;
    }
  }

  return false;
});​

Обратите внимание, что data-foo-bar был преобразован в fooBar.

Демонстрация: http://jsfiddle.net/Tyj49/3/

Answer 2

Я не уверен, что вы можете сделать это.Я взглянул на API, и вы, кажется, только в состоянии выполнить более глубокое частичное сопоставление значения, а не самого имени атрибута.

Я собираюсь дать вам потенциально разочаровывающий совет:«не делай этого».;-) В сущности, то, что вы ищете, это набор элементов div, которые соответствуют более общей категории.Не только data-foo-bar с, но ВСЕ data-foo с!Почему бы просто не дать всем data-foos имя класса, из которого вы можете выбрать, или отдельный атрибут, например data-foo="true"?

Другими словами, вместо того, чтобы строго придерживаться поставленного вопроса, мне было бы интереснознать, каков вариант использования, так что, возможно, боковой ход мышления может решить вашу проблему так же эффективно.Много способов снять шкуру с кошки и все такое.

Answer 3

Это просто альтернативное решение.Если вы можете убедиться, что искомое имя атрибута отсутствует в тексте элемента , вы можете получить значение externalHtml элемента и затем выполнить поиск по подстроке:

$("elementsToCheck").each(function () {
    var elemHtml = $('<div>').append($(this).clone()).html(); //clone to get the outerHTML
    if (elemHtml.indexOf("attributeName") >= 0) {
        // current element contains the attribute with name "attributeName"
    }
});

Надеюсь, это поможет.

Answer 4

Используйте .data() для получения всех атрибутов данных элемента, а затем используйте .filter для получения элементов, имеющих data-validation* атрибуты.

var validated_elements = $("p").filter(function() {
    var found = false;
    $.each($(this).data(function(key) {
        if (key.match(/^data-validation/)) {
            found = true;
            return false;
        }
    }
    return found;
});

Answer 5

Попробуйте это

$().ready(function() {  
  var test=$('#div_test').data("foo-bar");
  alert(test);
});

HTML:

<div data-foo-bar="hello" id="div_test"></div>

Answer 6

Попробуйте что-то вроде этого

var element = $('div[data-foo-bar=hello]')​;