如何在第三个元素之后删除每个 {元素}

How to remove every {element} after the 3rd one?

本文关键字:元素 之后 删除 三个      更新时间:2023-09-26

我有一个对象列表,我需要在特殊场合使用jQuery修剪。出于意图和目的,假设它看起来像这样:

<div id="container">
    <div class="child one">stuff</div>
    <div class="child two">stuff</div>
    <div class="child three">stuff</div>
    <div class="child four">stuff</div>
    <div class="child five">stuff</div>
</div>

有没有一种简单的方法(使用 jQuery,我想必要时使用纯 JS(在第三个之后删除"每个".child

注意:.one, .two .three不一定按数字顺序排列。

是的

,使用 :gt 选择器:

$("#container > .child:gt(2)").remove();

。这意味着"选择.child #container的直接子元素且位于索引 2 或更高(索引从 0 开始(的所有元素。

或者,如果你不喜欢使用 jQuery 的扩展选择器(因为它们不能传递到浏览器自己的选择器引擎(,你可以使用 .filter 来过滤子项:

$("#container > .child").filter(function(index) {
    return index > 2;
}).remove();

如果他们是唯一的孩子,您可以使用.children而不是该选择器的> .child部分:

$("#container").children().filter(function(index) {
    return index > 2;
}).remove();

使用 :gt(( 选择器和 .remove((

$(document).ready(function(){
$('#container .child:gt(2)').remove();
});

演示视图

$('.child').gt(2).remove();

这里 gt 表示大于