一定数量后去除DIV儿童

Question

我有这个HTML

<div class="control">
     <label class="">Label Here</label>
     <input type="text">
     <div class="ui-resizable"></div>
     <div class="ui-resizable-handle"></div>
     <div class="ui-resizable-handle ui-resizable-se"></div>
     <div style="display: inline;" class="delete"><span class="ui-icon ui-icon-closethick">close</span> </div>
     <div style="display: inline;" class="properties txtbox"><span class="ui-icon ui-icon-wrench">Properties</span></div>
</div>

如何使用jQuery从此HTML中删除第二个第三和第四个Div ....

Answer 1

您正在寻找:nth-child:http://api.jquery.com/nth-child-selector/

它的工作原理如下:

$('.control div:nth-child(2), .control div:nth-child(3), .control div:nth-child(4)').remove();

请注意,:nth-child使用基于一的索引,因此第一个元素具有索引1.

更新:在回答这个问题时,OP发表了评论

如果我不知道在输入字段之后会出现多少div,那么有任何方法可以将所有div或SLIV的第二个子节点之后出现的任何div或SLICE ...

答案是肯定的,为此您需要:gt:选择器:http://api.jquery.com/gt-selector/

$('.control div:gt(1)').remove()

相反:nth-child,:gt使用从零开始的索引,因此第一个元素具有索引0.

Answer 2

尝试:

$('.control').find("div").slice(1, 4).remove();

Answer 3

$('.controll>div:gt(1)').remove();

:gt 选择器将让你选择哪个索引大于1,theese是3.元素和更多

这是一个例子:http://jsfiddle.net/Am7Vw/1/