jQuery - 将样式应用于三列行中的中心div？

Question

我试图将边框添加到三列行中的中间列。这：

var subcount = $j('#sub > div').size(); 

给了我6，我试图找出如何将样式应用到中间的div？ （在这种情况下，2区和DIV 5）

<div id="sub"> 
<div>div 1</div> <div>div 2</div> <div>div3</div> 
<div>div 4</div> <div>div 5</div> <div>div6</div> 
</div> 

有没有办法做到这一点基于股利＃，而不是ID？喜欢，某种foreach循环或某种？

Answer 1

有很多方法可以做到这一点。这取决于数据的结构。该蛮力方式，如果只有6列：

$("#sub > div:nth-child(2), #sub > div:nth-child(5)").css("border", "1px solid black"); 

你也可以使用一个公式与:nth-child：

$("#sub > div:nth-child(3n+2)").css("border", "1px solid black"); 

Answer 2

如果这些确实列，你可能会更好使用真实表格，因为它更适合表格数据。您还没有标记行，这使得选择列变得困难。这样做的一个方法是这样的：

var n = 1; 
$('#sub > div').filter(function() { return n++ % 3 == 2 }); 

Answer 3

我会建议你在代码中添加一些类的后面，然后再涂CLASE选择。或者，更好的是，一种CSS风格。

如果您必须使用jQuery，cletus解决方案就是您想要的。

Answer 4

由于的jQuery返回数组的索引从零开始，只需运行像这样的“格”元素2和5：

$(document).ready(function() { 
    $("#sub div").filter(function (i) { 
     return i == 1 || i == 4; 
    }).css("background", "#b4b0da"); 
});