如何选择一些特定数量的div元素后的所有div元素？ [英] How to select all div element after some specific number of div elements?

问题描述

这是我的场景的示例代码。我有一些使用来自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/

解决方案

您可以使用：gt 选择器将目标索引大于作为参数传入的索引的元素作为目标。还要注意：gt 选择器的索引为0。使用：

  $（'＃itemContainer .item：gt（3）'）。hide（）; //隐藏项目index大于3 
  

工作演示

This is a sample code of my scenario. I have some elements that are loading inside a container div using PHP from a MYSQL table.

<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>

so their may be 10 or 12 items but I need only 4 items to be display at once. so I tried to select all the items after the fourth item. The way I tried has some problems so I need your help.

$(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/

解决方案

you can use :gt selector to target elements having index greater than the one passed as argument in it. also note that :gt selector has 0 based index. Use:

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

Working Demo

这篇关于如何选择一些特定数量的div元素后的所有div元素？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！