Question

我需要在第四个元素之后添加hr标记，但它会破坏我的jquery，从第四个元素中删除padding-right。

没有hr标签，我的jquery工作正常

 $("div.container  > div:nth-child(4n+4)").css("padding-right", "0px");

但是当我添加

标签时，它只是打破了jquery，在这种情况下它会从4 div和7th div中删除填充，因为它还将

计为子项。

< / p>

我也试过

$("div.container > div.image-wrapper:nth-child(4n+4)").css("padding-right", "0px");

这不起作用。

我如何修改它，以便它只计算与image-wrapper类相同的div作为它的子项，并从4＆amp;删除填充。仅限第8区。

HTML

<div class="container">
    <div class="image-wrapper"></div>
    <div class="image-wrapper"></div>
    <div class="image-wrapper"></div>
    <div class="image-wrapper"></div>
    <hr class="video-divider-line">
    <div class="image-wrapper"></div>
    <div class="image-wrapper"></div>
    <div class="image-wrapper"></div>
    <div class="image-wrapper"></div>
    <div class="image-wrapper"></div>

</div>

Answer 1

试试这个：

var $divs = $("div.container > div.image-wrapper");

for (var i = 3; i < $divs.length; i+=4) {
   $divs.eq(i).addClass('zero-padding');
}

http://jsfiddle.net/RKUae/

或者：

.zero-padding { padding-right: 0 }

$("div.container > div.image-wrapper").addClass(function(i) {
    if (++i % 4 === 0) return 'zero-padding';
});

Answer 2

$("div.container .image-wrapper:eq(3),div.container .image-wrapper:eq(6)").css("padding-right", "0px");

参考eq

Answer 3

尝试nth-of-type

$("div.container  > div:nth-of-type(4n+4)").css("padding-right", "0px");

或

$("div.container  > .image-wrapper:nth-of-type(4n+4)").css("padding-right", "0px");

使用jquery的第n个元素

3 个答案: