jQuery：选择不是某个类的后代的所有元素

Question

<div class="container" id = "0" >
   <div class="x" id = "1"> 
      <div id = "2"> 
        <p id = "3">
          <span id = "4" >text</span> 
        </p>
      <div>
    </div>

    <div id="5">
      <div id="6"> 
        <p id="7">
          <span class="x" id="8" >text</span> 
          <span id="9">text</span> 
        </p>
      <div>
    </div>
<div>

你能帮我选择所有元素吗：

• 是“.container”的后代
• 不是“.x”的后代
• 本身没有类“.x”。

---

查看上面的 HTML；它应该选择元素 5,6,7 和 9

• 元素 1 具有类“X”
• 元素 2 是具有类“X”的元素的直接子元素（元素 1）
• 元素 3 和 4 是具有类“X”的元素的后代（元素 1）

元素 8 具有类“X”

---

我有这个选择器，但它一直选择“X”类元素的后代（深子级）

var elements = $('.container').find().parents(':not(.X)').andSelf().filter(':not(.X)');

Answer 1

应该这样做：

$('.container').find(':not(.x):not(.x *)');

编辑：再次恢复到第一个版本。我认为它不能以这种方式工作，但是您的 HTML 中有一个错误，它使 #1 成为所有元素的父元素，因此没有选择任何元素。

<div class="container" id = "0" >
    <div class="x" id = "1"> 
      <div id = "2"> 
        <p id = "3">
          <span id = "4" >text</span> 
        </p>
      <div> <!-- <-- must be a closing div tag -->
    </div>

    <div id="5">
      <div id="6"> 
        <p id="7">
          <span class="x" id="8" >text</span> 
          <span id="9">text</span> 
        </p>
      <div> <!-- <-- must be a closing div tag -->
    </div>
<div> <!-- <-- must be a closing div tag -->

Answer 2

也可以使用通配符

$(".container :not(* .x)")

或

$(":not(* .x)", ".container")

可能会起作用。