使用 JQuery 的查找方法，我如何根据 child 的 "foo" 的内容 select 某个 HTML 元素 "foo" 的兄弟姐妹=]？

Question

假设我 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 元素。但是现在如何在兄弟 div 中获取 p 元素？有什么方法可以告诉 find 哪个 parent 得到 ?

的兄弟姐妹

Answer 1

$('.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...）

使用 JQuery 的查找方法，我如何根据 child 的 "foo" 的内容 select 某个 HTML 元素 "foo" 的兄弟姐妹=]？

Using JQuery's find method, how do I select a sibling of some HTML element "foo", based on the content of a child of "foo"?

html

jquery

jquery-selectors