javascript - 删除子级之后的所有下一个 div

Question

我有这样的东西:

<div>
     <div class="productPage"></div>       
     <div>is hidden</div>  // ***this content will be hidden
</div>

// *** this one will not become hidden.
<div>not hidden..</div>

使用这个:

   $( ".productPage").nextAll().addClass( "hidden" );

这将仅隐藏我在代码上标记的内容，意味着仅隐藏同一父级的子级。我需要隐藏 productPage 之后的所有内容。

Answer 1

您还应该转到父级并定位下一个 div。

$(".productPage").nextAll().addClass("hidden");
$(".productPage").parents("div").eq(0).nextAll().addClass("hidden");

.hidden {
  display:none;
}

<div>
  <div class="productPage"></div>
  <div>is hidden</div> <!-- this content will be hidden  -->
</div>

<!-- this one will not become hidden. -->
<div>not hidden..</div>

<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>