Используя метод поиска JQuery, как выбрать одного или нескольких элементов HTML "foo" на основе содержимого дочернего элемента "foo"? - PullRequest
1 голос
/ 08 марта 2020

Предположим, у меня есть HTML, как показано ниже:

<div class="foo-container">
  <div class="foo">
    <div class="foo-child">
      <span>The Important Label</span>
    </div>
  </div>
  <div class="elem-to-manipulate">
    <p>I want to manipulate the style in this because it's the sibling of "The Important Label"</p>
  </div>
</div>

Как я могу нацелиться на этот элемент p, основываясь на том факте, что у его брата есть текст The Important Label.

Я получил что-то вроде

$('.root').find('.foo > .foo-child > span:contains("The Important Label")')

, что успешно дает мне элемент span. Но теперь, как мне получить элемент p в брате div? Есть ли какой-нибудь способ узнать, у какого родителя есть брат или сестра?

1 Ответ

2 голосов
/ 08 марта 2020
$('.root').find('.foo:has(> .foo-child > span:contains("The Important Label")) + div > p')
  • aaa:has(bbb) проверяет, есть ли что-либо, совпадающее с aaa bbb, и только тогда оно совпадает aaa
  • + соответствует следующему брату ранее сопоставленного элемента

(В зависимости от вашего случая использования вы можете быть удовлетворены .foo:contains("The Important Label") + div > p ...)

...