Question

我正在使用JQuery的nth-child选择器来改变每个第3个div上的一个photo_post_thumbnail类的边距，但它会在每个第二个div中改变它？

有人能发现我做错了吗？

网站

http://www.clients.eirestudio.net/hatstand/wordpress/photos/

HTML标记

<div class="postbox photo_post_thumbnail">
      blah blah
</div>

<div class="postbox photo_post_thumbnail">
      blah blah
</div>

<div class="postbox photo_post_thumbnail">
      blah blah
</div>

JQuery代码

$('.photo_post_thumbnail:nth-child(3n)').css('margin-right', '0px');

Answer 1

这样做是因为你在这些div之前有一个<h1>，使得div成为第四个孩子而不是第三个孩子：）

nth-child选择器起初有点令人困惑，因为它是父的nth-child ，而不仅仅是匹配该选择器的nth-child <父级的/ em>，选择器没有承载此选择器的位置。

要获得所需的div，请按照以下3n+1进行操作：

$('.photo_post_thumbnail:nth-child(3n+1)').css('margin-right', '0px');

Answer 2

替代解决方案：

   $('.photo_post_thumbnail').each(function(i) {
      i=(i+1);
      if(i%3==0){
     $(this).css("margin-right","0px"));
    }
   });

JQuery nth-child工作不正常

2 个答案: