代码一
<h3>:first/:last/:even/:odd</h3>
<div class="left">
<div class="div">
<p>div:first</p>
<p>:even</p>
</div>
<div class="div">
<p>:odd</p>
</div>
<div class="div">
<p>:even</p>
</div>
<div class="div">
<p>:odd</p>
</div>
<div class="div">
<p>:even</p>
</div>
<div class="div">
<p>div:last</p>
<p>:odd</p>
</div>
</div>
###1、:first,筛选第一个元素 $(".div:first")选择了代码一中
<div class="div">
<p>div:first</p>
<p>:even</p>
</div>
2、:last,筛选最后一个元素
$(".div:last")选择了代码一中
<div class="div">
<p>div:last</p>
<p>:odd</p>
</div>
3、:even,筛选索引值为偶数的元素,索引从0开始计数
$(".div:even")选择了代码一中
<div class="div">
<p>div:first</p>
<p>:even</p>
</div>
<div class="div">
<p>:even</p>
</div>
<div class="div">
<p>:even</p>
</div>
即在class属性为“div”的元素中,索引为0/2/4,实际位置是1/3/5的元素
4、:odd,筛选索引值为奇数的元素,索引从0开始计数
$(".div:odd")选择了代码一中
<div class="div">
<p>:odd</p>
</div>
<div class="div">
<p>:odd</p>
</div>
<div class="div">
<p>div:last</p>
<p>:odd</p>
</div>
即在class属性为“div”的元素中,索引为1/3/5,实际位置是2/4/6的元素
代码二
<h3>:eq/:gt/:lt</h3>
<div class="left">
<div class="aaron">
<p>:lt(2)</p>
</div>
<div class="aaron">
<p>:lt(2)</p>
</div>
<div class="aaron">
<p>:eq(2)</p>
</div>
<div class="aaron">
</div>
<div class="aaron">
<p>:gt(3)</p>
</div>
<div class="aaron">
<p>:gt(3)</p>
</div>
</div>
5、:eq(index),在给定的集合中选择索引值为index的元素
$(".aaron:eq(2)")选择了代码二中的
<div class="aaron">
<p>:eq(2)</p>
</div>
###6、:gt(index),在给定的集合中选择索引值大于index的元素 $(".aaron:gt(3)")选择了代码二中的
<div class="aaron">
<p>:gt(3)</p>
</div>
<div class="aaron">
<p>:gt(3)</p>
</div>
###7、:lt(index),在给定的集合中选择索引值小于index的元素 $(".aaron:lt(2)")选择了代码二中的
<div class="aaron">
<p>:lt(2)</p>
</div>
<div class="aaron">
<p>:lt(2)</p>
</div>