Question

我有一个包含四个段落标记的div。当页面加载时，我想要显示前两个段落然后隐藏后面的段落元素，但我不知道如何做到这一点。为简单起见，我在下面的jsfiddle示例中将事件设置为按钮与文档就绪事件。

<div id="div">
<p>1 keep me shown</p>
<p>2 keep me shown</p>
<p>3 hide me</p>
<p>4 hide me</p>
</div>

<input type="button" value="press" id="button"/>

<script>

$('#button').click(function () {

$('#div').children().hide();

});

</script>

Answer 1

你快到了那里：

$('#div').children(':gt(1)').hide();

有关:gt选择器的详情。

http://jsfiddle.net/gromer/Tdue6/1/

Answer 2

使用:gt() selector选择

Answer 3

您可以使用:gt()选择器：

$("#div p:gt(1)").hide();

或者，您也可以使用.slice()从jQuery对象的DOM数组中选择特定元素：

$("#div p").slice(2).hide();

Answer 4

作为替代方案，您也可以使用.slice（）

$('#div').children().slice(2).hide();

http://api.jquery.com/slice/

Answer 5

你也可以只使用CSS

li:nth-child(-1n+2) {
    background: yellow;
}

选择具有所有相同元素标记的子组

5 个答案: