Проверьте, есть ли у какого-либо предка класс с использованием jQuery

156

Есть ли способ в jQuery проверить, есть ли у какого-либо родителя, прародителя, пра-пра-прародителя класс.

У меня есть структура разметки, которая позволила мне делать такие вещи в коде:

$(elem).parent().parent().parent().parent().hasClass('left')

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

Я использую JQuery 1.7.2.

— crmpicco
источник

stackoverflow.com/questions/16863917/… - на случай, если кто-то захочет сделать это без jQuery

— Роберт Ньестрой

Ответы:

304

if ($elem.parents('.left').length) {

}

— Alex
источник

Спасибо, как раз то, что мне было нужно! К .lengthсведению , хотя практика трактовки истинной ценности в JS весьма плодотворна, она гораздо яснее и проще для понимания.length > 0

— dooleyo

Вот ссылка на Jquery .parents () документации

— H Dog

Существует много способов фильтрации элементов-предков.

if ($elem.closest('.parentClass').length /* > 0*/) {/*...*/}
if ($elem.parents('.parentClass').length /* > 0*/) {/*...*/}
if ($elem.parents().hasClass('parentClass')) {/*...*/}
if ($('.parentClass').has($elem).length /* > 0*/) {/*...*/}
if ($elem.is('.parentClass *')) {/*...*/}

Осторожно , closest() метод включает сам элемент при проверке селектора.

В качестве альтернативы, если у вас есть уникальный селектор, соответствующий $elem, например #myElem, вы можете использовать:

if ($('.parentClass:has(#myElem)').length /* > 0*/) {/*...*/}
if(document.querySelector('.parentClass #myElem')) {/*...*/}

Если вы хотите сопоставить элемент в зависимости от его класса-предка только для стилизации, просто используйте правило CSS :

.parentClass #myElem { /* CSS property set */ }

— А. Вольф
источник

Я мог бы сказать (не проверяя это), что этот метод лучше. Elem.parents будет проходить через весь родительский объект Strucutre, где closest () должен (вероятно) остановиться, как только найдет ближайшего родителя с этим элементом и, следовательно, будет более эффективным. Это необразованное предположение. Я обычно использую closest (). Похоже, я нашел новую тему для своего блога! : P

— dudewad

@ Dudewad Да, но это совсем недавно. Я имею в виду, в более старой версии JQ, AFAIK, это было не так. Родительский цикл не был прерван в первом подобранном родителе с помощью closest (), но теперь это так. (не знаю, с какой версии jq, но я точно уверен, что я буду прав в этом утверждении)

— А. Вольф

Полезно знать, спасибо за информацию. Странно, что они не построили бы взлом с первой версии.

— dudewad

когда нет родителей, которые можно найти, родители () быстрее ближайшего () jsperf.com/closest-vs-parents-foobar

— Алекс

@ Алекс Действительно интересно, спасибо за ввод! Кстати, перечитывая вопрос, Is there any way in jQuery to check if any parent,..., closest()проверка самого элемента , так это на самом деле не отвечая на вопрос, ОП может пожелать explecitely исключить сам элемент, так уа, ответ должен был использовать.parents()

— А. Вольфа

Вы можете использовать parentsметод с указанным .classселектором и проверить, соответствует ли какой-либо из них:

if ($elem.parents('.left').length != 0) {
    //someone has this class
}

— Игорь Дымов
источник