JQuery селектор: эксклюзивный ИЛИ - PullRequest
2 голосов
/ 26 января 2011

Я использую набор селекторов jQuery для вставки некоторого контента на несколько разных страниц; однако некоторые страницы содержат более одного селектора, поэтому контент вставляется на страницу более одного раза. Например:

$('div.rColInnerL:first, div.box300.bdr.search:first, h2.blt13:first').before('<div>Hello World!</div>');

Можно ли использовать некое ИЛИ в селекторе jQuery, чтобы сказать, что должен использоваться только один из них? Большое спасибо.

Ответы [ 3 ]

6 голосов
/ 26 января 2011

Вы можете уменьшить набор найденных элементов до первого:

$('div.rColInnerL:first, div.box300.bdr.search:first, h2.blt13:first')
.first()
.before('<div>Hello World!</div>');
4 голосов
/ 26 января 2011

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

$('div.rColInnerL:first, div.box300.bdr.search:first, h2.blt13:first').first()

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

jQuery не обязательно возвращает элементы в порядке селектора, а скореев порядке их появления на странице, так что это не обязательно повторяет «исключающее ИЛИ» поведение, которое вы ищете.

Чтобы быть более точным, вам нужно что-то более явное:

var el = $('div.rColInnerL:first');
if( !el.length ) {
    el = $('div.box300.bdr.search:first');
    if( !el.length ) {
        el = $('h2.blt13:first');
    }
}

Вот пример того, как jQuery не возвращает элементы в порядке селектора:

<body>
    <div id="first">first</div>
    <div id="second">second</div>
</body>
alert( $('#second, #first')[0].id ); // alerts "first" instead of "second"

Даже если #second является первым в селекторе,первое совпадение отображается как элемент #first, поскольку оно стоит первым в документе.

Пример: http://jsfiddle.net/XxXXc/

0 голосов
/ 03 июля 2019

Выбранный ответ мне не подходит.

Я использовал это:

var container = $('div.rColInnerL:first')[0] || 
  $('div.box300.bdr.search:first')[0] || 
  $('h2.blt13:first')[0];

$(container).before('<div>Hello World!</div>');
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...