Найти все элементы с определенным значением атрибута в jquery

88

Мне нужно найти все элементы со специальным значением атрибута.

Вот div, который мне нужно найти (у меня их много ..)

<div imageId='imageN'>...

Мне просто нужно перебрать div, у которых есть imageId='imageN'

Пабук
источник
6
Я бы рекомендовал использовать class="imageN"для правильного HTML. Либо так, либо data-imageId="imageN"ради валидного HTML5. В первом случае вы сможете использовать селектор классов.
Энди Э
Энди, причина в том, что эти div динамически добавляются из кода программной части и имеют разные ImageIds, но один и тот же класс '.
Pabuc
3
У вас может быть несколько классов, class="image imageN"если это поможет.
Val
Почему бы не выбрать имя класса, если у них уже есть тот же класс?
Praxis Ashelin

Ответы:

143
$('div[imageId="imageN"]').each(function() {
    // `this` is the div
});

Чтобы проверить единственное существование атрибута, независимо от того, какое значение, вы можете вместо этого использовать селектор ths: $('div[imageId]')

ThiefMaster
источник
4
@ThiefMaster - Если значение атрибута не является постоянным (т.е. оно может меняться), то как его найти?
Разработчик
пара вопросов: 1 - как насчет других элементов ... 2 - как насчет других значений ... У меня может быть атрибут data-food для многих элементов: div, img и td, где каждый имеет свое значение.
dsdsdsdsd
@ParthoGanguly Вы используете переменную следующим образом: $ ('div [imageId = "' + variableName + '"]')
Kama
1
Это решение действительно не соответствует названию этой страницы. Вы ищете элементы, которые являются div. Правильное решение - это решение, не зависящее от фактического элемента.
AndroidDev
164

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

$("*[attr-name]")

Надеюсь, что это поможет кому-то, кто случайно попал на эту страницу в поисках того же, что и я :).

Обновление: похоже, что звездочка не требуется, т.е. на основе некоторых базовых тестов, следующее кажется эквивалентным приведенному выше (спасибо Мэтту за указание на это):

$("[attr-name]")
Sammy34
источник
Отлично! Именно то, что я искал.
Паулюс Матулионис
Вполне возможно ... Я не проверял аспект производительности (в то время это не было важным фактором для меня).
sammy34 09
3
Есть ли разница между этим и $("[attr-name]")? (т.е. нет *)
Мэтью
Да, между ними есть определенная разница. ошибка появления звездочки в firefox !!!! (Unescaped ...)
ozz
добавив к этому, вы также можете включить значение атрибутов, например:$("[data-toggle='modal']")
MeltingDog
12

Это не называется тегом; то, что вы ищете, называется атрибутом html.

$('div[imageId="imageN"]').each(function(i,el){
  $(el).html('changes');
  //do what ever you wish to this object :) 
});
Вал
источник
5

Вы можете использовать частичное значение атрибута для обнаружения элемента DOM с помощью знака (^). Например, у вас есть такие div:

<div id="abc_1"></div>
<div id="abc_2"></div>
<div id="xyz_3"></div>
<div id="xyz_4"></div>...

Вы можете использовать код:

var abc = $('div[id^=abc]')

Это вернет DOM-массив div с идентификатором, начинающимся с abc:

<div id="abc_1"></div>
<div id="abc_2"></div>

Вот демонстрация: http://jsfiddle.net/mCuWS/

Крунал
источник
4

Используйте конкатенацию строк. Попробуй это:

$('div[imageId="'+imageN +'"]').each(function() {
    $(this);   
});
LostSenSS
источник