如何选择DOM中除一个div及其子元素之外的所有元素

Question

我需要使用JQuery/JS选择DOM中除一个div以外的所有元素。唯一的问题是，我还需要在选择中排除div的子元素。例如：

<li>1</li>
<li>2</li>
<div>
  3
  <li>3.1</li>
  <li>3.2</li>
</div>

$('*').not('div and children');

//should give me li 1 and 2, but not div 3 or li 3.1/3.2

我已经尝试使用.not()关键字，但它只选择了父div，子元素仍然受到影响。

- TechnicalTophat

---

你不能在 ul 中使用 div。这在 HTML 中是无效的。 - Mohammad

@Mohammad 我知道，那只是一个例子 :-) 实际上我是在使用 Bootstrap 模态框来完成它的。 - TechnicalTophat

只是省略直接子元素，还是包括它们下面的所有后代元素？ - Barmar

Answer 1

你可以使用$('body *')选择所有元素，但不能选择div和div的子元素，可以使用.not('div, div *')来实现。它是与非选择器，表示除了指定的元素和其子元素外，选择其他所有元素。

$('body *').not('div, div *').css('color', 'red');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li>1</li>
<li>2</li>
<div>
  3
  <li>3.1</li>
  <li>3.2</li>
</div>

- Nenad Vracar

Answer 2

console.log($('body *').not('div, div li, script'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<li>1</li>
<li>2</li>
<div>
  3
  <li>3.1</li>
  <li>3.2</li>
</div>

- Mohammad Usman

Answer 3

$('*').not('div, div > li');

- C14L