Question

我对querySelector有疑问。有没有一种方法可以搜索html文件中的所有p元素，但跳过特定div中的p个元素？

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
 <div>
     <p>hit</p>
     <p>hit</p>
     <p>hit</p>
     <div>
         <p>hit</p>
         <p>hit</p>
         <p>hit</p>
         <p>hit</p>

     </div>
 </div>
<div class="donthit">
    <p>dont</p>
    <p>find</p>
    <p>us</p>
</div>
</body>
</html>

这就是我的示例html。有没有办法获取所有p个元素，但没有获取div class =“ donthit”中的那些元素？

Answer 1

您可以先获取所有没有特定div的div，然后在其中找到p元素：

$('div:not(.donthit)').children('p').addClass('red');

.red {
  border:1px solid red;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  <p>hit</p>
  <p>hit</p>
  <p>hit</p>
  <div>
    <p>hit</p>
    <p>hit</p>
    <p>hit</p>
    <p>hit</p>

  </div>
</div>
<div class="donthit">
  <p>dont</p>
  <p>find</p>
  <p>us</p>
</div>

Answer 2

您可以使用.not（）方法或：not（）选择器

基于您的示例的代码：

$("div:not(.donthit)").children("p")   // not selector 
$("div").not(".donthit").children("p") // not method

querySelector用于跳过元素

2 个答案: