如何选择div元素后的一些特定数量的div元素？

Question

这是我的场景的示例代码。我有一些使用来自MYSQL表的PHP在容器div中加载的元素。

<div id="itemContainer"> 
    <div class="item"> 
     test 
    </div> 
    <div class="item"> 
     test 
    </div> 
    <div class="item"> 
     test 
    </div> 
    <div class="item"> 
     test 
    </div> 
    <div class="item"> 
     test 
    </div> 
    <div class="item"> 
     test 
    </div> 
</div> 

所以他们可能是10或12个项目，但我只需要4个项目一次显示。所以我试着选择第四项后的所有项目。我尝试的方式有一些问题，所以我需要你的帮助。

$(document).ready(function() { 
     var items = $('#weekly_best_selling').children('.itemContainer').length; 
     if (items > 6) { 
      $('#weekly_best_selling').children('.itemContainer').nextAll('.itemContainer').css("background-color", "red"); 
     } 
    }); 

http://jsfiddle.net/yasithao3/j2zyhmr3/

Answer 1

可以使用:gt选择器来靶向具有指数比一个作为它参数传递更大的元件。还请注意，:gt选择器具有基于0的索引。用途：

$('#itemContainer .item:gt(3)').hide();//hide items having index greater than 3 

Working Demo

Answer 2

$('.item:gt(3)').hide() 

使用jQuery的:gt()选择。