如何使用jquery选择不是特定元素子元素的元素？

Posted 2023-05-09

【中文标题】如何使用jquery选择不是特定元素子元素的元素？

【英文标题】：How to select element that isn't a child of specific element using jquery?

【发布时间】：2019-05-15 22:34:57

【问题描述】：

如何仅选择没有div.option 作为父级的spans？

<div class="option">
    <span>Content goes here</span>
</div>
<span>Content goes here</span>
<span>Content goes here</span>
<div class="option">
    <span>Content goes here</span>
</div>

【问题讨论】：

这里很好的解决方案：***.com/questions/965816/…

使用该块的直接父级，例如.container > span

【参考方案1】：

您需要选择所有span 并使用:not() 排除属于.option 子级的跨度

$("span:not(div.option > span)").css("color", "red");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="option">
    <span>Content goes here</span>
</div>
<span>Content goes here</span>
<span>Content goes here</span>
<div class="option">
    <span>Content goes here</span>
</div>