如何選擇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()選擇。