Мне интересно, есть ли способ иметь логику "ИЛИ" в селекторах jQuery. Например, я знаю, что элемент является потомком элемента с классом classA или classB, и я хочу сделать что-то вроде elem.parents('.classA or .classB')
. Предоставляет ли jQuery такую функциональность?
JQuery ИЛИ Селектор?
Ответ 1
Используйте запятую.
'.classA, .classB'
Вы можете опустить пробел.
Ответ 2
Использование запятой может быть недостаточно, если у вас есть несколько объектов jQuery, которые необходимо объединить.
Метод . add() добавляет выбранные элементы в результирующий набор:
// classA OR classB
jQuery('.classA').add('.classB');
Это более подробный, чем '.classA, .classB'
, но позволяет создавать более сложные селектора, такие как:
// (classA which has <p> descendant) OR (<div> ancestors of classB)
jQuery('.classA').has('p').add(jQuery('.classB').parents('div'));
Ответ 3
Я написал невероятно простой (5 строк кода) плагин для этой функции:
http://byrichardpowell.github.com/jquery-or/
Это позволяет вам эффективно сказать "получить этот элемент, или если этот элемент не существует, используйте этот элемент". Например:
$( '#doesntExist' ).or( '#exists' );
В то время как принятый ответ обеспечивает аналогичную функциональность, если оба селектора (до и после запятой) существуют, оба селектора будут возвращены.
Надеюсь, это окажется полезным для всех, кто может попасть на эту страницу через google.
Ответ 4
Если вы хотите использовать стандартную конструкцию element = element1 || element2, где JavaScript вернет первую правду, вы можете сделать именно это:
element = $('#someParentElement .somethingToBeFound') || $('#someParentElement .somethingElseToBeFound');
который вернет первый найденный элемент. Но лучше было бы, вероятно, использовать конструкцию запятой jQuery селектора (которая возвращает массив найденных элементов) следующим образом:
element = $('#someParentElement').find('.somethingToBeFound, .somethingElseToBeFound')[0];
который вернет первый найденный элемент.
Я использую это время от времени, чтобы найти активный элемент в списке или какой-либо элемент по умолчанию, если нет активного элемента. Например:
element = $('ul#someList').find('li.active, li:first')[0]
который вернет любой li с классом active или, если его не будет, просто вернет последний li.
Либо все будет работать. Существуют потенциальные штрафы за производительность, хотя, поскольку || прекратит обработку, как только найдет что-то правдоподобное, в то время как массивный подход попытается найти все элементы, даже если он уже нашел его. Опять же, используя || Конструкция потенциально может иметь проблемы с производительностью, если она должна пройти через несколько селекторов, прежде чем найти тот, который она вернет, потому что она должна вызывать основной объект jQuery для каждого из них (я действительно не знаю, является ли это ударом производительности или нет, это просто логично, что это может быть). В общем, я использую подход массива, когда селектор является довольно длинной строкой.
Ответ 5
Наконец-то я нашел хак, как это сделать:
div:not(:not(.classA,.classB)) > span
(выбирает div с классом classA
ИЛИ classB
с прямым дочерним диапазоном)
Ответ 6
Daniel A. White Solution отлично подходит для занятий.
У меня возникла ситуация, когда мне приходилось находить поля ввода, такие как donee_1_card, где 1 - индекс.
Мое решение было
$("input[name^='donee']" && "input[name*='card']")
Хотя я не уверен, насколько это оптимально.