jQuery Определите, имеет ли сопоставленный класс заданный идентификатор

Что такое jQuery имеет идентификатор, эквивалентный следующему утверждению?

$('#mydiv').hasClass('foo')

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

что-то вроде:

$('.mydiv').hasId('foo')

Вы можете встроить эту логику в селектор, объединив несколько селекторов . Например, мы могли бы настроить таргетинг на все элементы с данным идентификатором, которые также имеют определенный класс:

$("#foo.bar"); // Matches <div id="foo" class="bar">

Это должно быть похоже на то, что вы бы написали в CSS. Обратите внимание, что он не будет применяться ко всем #fooэлементам (хотя должен быть только один) и не будет применяться ко всем .barэлементам (хотя их может быть много). Он будет ссылаться только на элементы, соответствующие обоим атрибутам.

В jQuery также есть отличный .isметод, который позволяет определить, обладает ли элемент определенными качествами. Вы можете протестировать коллекцию jQuery с помощью селектора строк, элемента HTML или другого объекта jQuery. В этом случае мы просто проверим его по селектору строк:

$(".bar:first").is("#foo"); // TRUE if first '.bar' in document is also '#foo'

Я бы, вероятно, использовал $('.mydiv').is('#foo');Это сказано, если вы знаете идентификатор, почему бы вам просто не применить его к селектору?

обновление: извините, неправильно понял вопрос, удален .has()ответ.

другой альтернативный способ, создать .hasId()плагин

// the plugin
$.fn.hasId = function(id) {
  return this.attr('id') == id;
};

// select first class
$('.mydiv').hasId('foo') ?
  console.log('yes') : console.log('no');

// select second class
// $('.mydiv').eq(1).hasId('foo')
// or
$('.mydiv:eq(1)').hasId('foo') ?
  console.log('yes') : console.log('no');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="mydiv" id="foo"></div>
<div class="mydiv"></div>

Допустим, вы просматриваете некоторые объекты DOM и хотите найти и поймать элемент с определенным идентификатором.

<div id="myDiv">
    <div id="fo"><div>
    <div id="bar"><div>
</div>

Вы можете написать что-нибудь вроде найти

$('#myDiv').find('#bar')

Обратите внимание, что если вы использовали селектор классов, метод find вернет все совпадающие элементы.

или вы можете написать итеративную функцию, которая будет выполнять более сложную работу

<div id="myDiv">
    <div id="fo"><div>
    <div id="bar"><div>
    <div id="fo1"><div>
    <div id="bar1"><div>
    <div id="fo2"><div>
    <div id="bar2"><div>
</div>

$('#myDiv div').each(function() {
   if($(this).attr('id') == 'bar1')
       //do something with bar1
});

Тот же код можно легко изменить для селектора классов.

<div id="myDiv">
    <div class="fo"><div>
    <div class="bar"><div>
    <div class="fo"><div>
    <div class="bar"><div>
    <div class="fo"><div>
    <div class="bar"><div>
</div>

$('#myDiv div').each(function() {
   if($(this).hasClass('bar'))
       //do something with bar
});

Я рад, что вы решили свою проблему с помощью index (), что когда-либо работает для вас. Я надеюсь, что это поможет другим с той же проблемой. Ура :)

$('#' + theMysteryId + '.someClass').each(function() { /* do stuff */ });

Просто хочу сказать, что в конце концов я решил эту проблему с помощью index ().

НИЧЕГО больше не работало.

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

РЕДАКТИРОВАТЬ: для тех, кто не знает (например, я), index () дает значение индекса для каждого элемента, который соответствует селектору, считая от 0, в зависимости от их порядка в DOM. Пока вы знаете, сколько элементов с class = "foo", вам не нужен идентификатор.

Очевидно, это не всегда помогает, но кому-то это может пригодиться.

Проверить, существует ли идентификатор элемента

if ($('#id').attr('id') == 'id')
{
  //OK
}

Вы также можете проверить, используется ли элемент id, выполнив следующие действия:

if(typeof $(.div).attr('id') == undefined){
   //element has no id
} else {
   //element has id selector
}

Я использую этот метод для глобальных таблиц данных и определенных упорядоченных таблиц данных