0

我正在使用 :nth-child 选择器来选择某些元素

情况1：

<div class='item show'>
<div class='item show'>
<div class='item show'>
<div class='item show'>
<div class='item show'>
<div class='item show'>
<div class='item show'>
<div class='item show'>

和

案例2：

<div class='item show'>
<div class='item'>
<div class='item'>
<div class='item show'>
<div class='item'>
<div class='item'>
<div class='item show'>
<div class='item show'>

我的代码从案例 1 开始，并执行 $('#outerDiv .show:nth-child(3n - 2)') 来选择每三个元素。这完美地工作。然后，如果用户更改某些设置，则某些元素会丢失它们的显示类并消失在屏幕上，代码看起来像案例 2。问题是现在当我执行 $('#outerDiv .show:nth-child(3n - 2)') 选择器，它仍然将其视为案例 1，即使我可以在控制台中清楚地看到它是案例 2。我做错了什么。抱歉，我无法发布实际代码，所以我举了一个简单的例子。

谢谢

4

3 回答 3

1

nth-child选择器将获取所有元素，而与类无关..

使用 a$.each并在循环中分配类

​$('#outerDiv .show').each(function(i){
    if( i%3 === 0){
       $(this).addClass('a'); 
    }        
});​

检查小提琴

于 2012-11-30T21:20:50.347 回答
0

我将从关闭 div 元素开始。

代替

<div class='item show'>

放

<div class='item show'></div>

这是一个快速演示，它选择 DOM 中的每第三个（也是第一个）元素：http: //jsfiddle.net/robertp/hVBAC/2/

我希望它有点帮助:)

于 2012-11-30T21:28:05.903 回答
0

使用filter和css函数：

 $('#outerDiv .show').filter(function(){
    return $(this).css('display') !== 'none';
 }).filter(":nth-child(3n - 2)");

首先，将元素列表过滤为没有属性的元素display:none。接下来，过滤第 n 个孩子。

于 2012-11-30T21:28:14.783 回答