Question

我的网页填充了相同类元素的变量编号。我想为每个第2，第5，第8，第11等课程设置一个左右边距（如果有的话）。

有没有办法用javascript实现这一目标？我不想使用css3子选择器，因为它在旧浏览器上不兼容。

我的div是这样的：

[div class =“block”] [div class =“block”] [div class =“block”]

[div class =“block”] [div class =“block”] [div class =“block”]

[div class =“block”] [div class =“block”] [div class =“block”]

[div class =“block”] [div class =“block”] [div class =“block”]

我希望每个中间div都有左右边距。

谢谢。：）

Answer 1

尝试使用jQuery中的nth-child选择器

$('div:nth-child(3n - 1)').css('margin-top', '10px')

演示：Fiddle

Answer 2

试试这个。

i = 2;
block(i);

function block(i) {

    $(".block:eq(" + i + ")").css({"margin-left":"10px" ,"margin-right":"20px" });

    i = i + 3;

    block(i);

}

Answer 3

如果您不想使用CSS3子选择器，则必须在服务器端或使用JavaScript。

正如你用jQuery标记答案我假设这是你的首选，所以你可以尝试类似的东西：

$('.block:nth-child(3n+2)').addClass('middle');

为每个第2，第5，第8，第11等类元素添加边距

3 个答案: