Почему не работает определение значения атрибута data-*?

Question

[Alexander Lashchevsky]

Здравствуйте!

Есть блоки, среди которых, например:<div class="block" data-item="abc">

Мне необходимо с .block, имеющий значение атрибута data-item, заданного в переменной, что-нибудь сделать. Например, скрыть.

Пример.
Для начала: var attrDataItem = abc;

Затем пробую несколько вариантов, чтобы хотя бы один из них работал:

$('.block').data('item', attrDataItem).hide();
$('.block').attr('data-item', attrDataItem).hide();
$('[data-item=' + attrDataItem + ']').hide();

И работает только последний случай. Но здесь мы скрываем блок, имеющий data-item, как указано в переменной, вне зависимости от класса. Мне же необходимо скрывать блок только при совпадении одновременно двух условий:

1. data-item такой, как указано в attrDataItem
   
2. блок имеет класс .block
   

Как же это сделать?

Answer 1

[Алексей Уколов]

$('[data-item=' + attrDataItem + ']').hide();
Здесь, действительно идет выборка, но класс в селектор вы не добавили.

Правильный вариант такой (Интерактивный пример):

$('.block[data-item="' + attrDataItem + '"]').hide();

Comments

[Иван Соломенников]

>>>Очевидно, что вам не хватает знаний или понимания API jQuery
Или console.log($()); Но это для тех кто сможет самостоятельно понять.(Хотя там и понимать то нечего)

[Алексей Уколов]

Да, такой вариант тоже возможен. Но это скорее хакинг, а не программирование.

[Евгений Петров]

$('.block').data('item', attrDataItem).hide();
Здесь вы устанавливаете значение атрибута.

Нет, это не так.

$('.block').attr('data-item', attrDataItem).hide();

Этот код аналогичен первому

Вообще не соответствует.

Пример

Очевидно, что вам не хватает знаний или понимания API jQuery, настоятельно рекомендую их подтянуть.

[Алексей Уколов]

Евгений Петров, действительно, спасибо за то, что заметили.