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）在第三个之后删除'every'.child？

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

Answer 1

是的，使用:gt selector：

$("#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();

Answer 2

使用：gt（）选择器和.remove（）

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

DEMO VIEW

Answer 3

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

这里gt表示greaterthan

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

3 个答案: