如何删除第3个之后的每个{element}？

Question

我有一个对象列表,我需要在使用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在第三个之后删除'every' ？

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

Answer 1

是的,使用: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();