Javascript 可以选择流到下一行的类的所有div吗?

Javascript 可以选择流到下一行的类的所有div吗?,javascript,jquery,html,css,Javascript,Jquery,Html,Css,所以我有7到12个相同风格的div,它们都向左浮动。我正在为所有流到第二行的css选择器寻找。我很确定这在标准css中是不可能的,但我想知道是否有人知道jQuery或其他可以实现这一点的技巧。非常感谢 正如你自己所说,CSS(据我所知)无法做到这一点。但是,使用jQuery可以很容易地完成这项工作 一种方法是使用和的组合,只保留顶部偏移高于其他元素(不适合第一行的元素)的元素 var$elm=$(“.yourSelector”);//在这里使用选择器 var$secondRowElms=$elm

所以我有7到12个相同风格的div,它们都向左浮动。我正在为所有流到第二行的css选择器寻找。我很确定这在标准css中是不可能的,但我想知道是否有人知道jQuery或其他可以实现这一点的技巧。非常感谢

正如你自己所说,CSS(据我所知)无法做到这一点。但是,使用jQuery可以很容易地完成这项工作

一种方法是使用和的组合,只保留顶部偏移高于其他元素(不适合第一行的元素)的元素

var$elm=$(“.yourSelector”);//在这里使用选择器
var$secondRowElms=$elm.filter(函数(){
//将每个项目与第一个项目进行比较,以查看其偏移量是否较高
返回($elm.first().offset().top<$(this.offset().top);
});
这里还有一个演示:

然后,您可以使用索引在数组中循环,并检查.newLine==true以执行需要对div执行的任何操作

更新:

关于如何使用此功能的示例:

var divCount = $divs.length;
for(var i=0; i<divCount; i++) {
 if(true == arrOffsetTops[ i ].newLine) {
  $divs.eq( i ).addClass('newline-marker');
 }
}

.newline-marker {
 -webkit-box-shadow:0 0 10px black;
 -khtml-box-shadow:0 0 10px black;
 -moz-box-shadow:0 0 10px black;
 -o-box-shadow:0 0 10px black;
 -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=0, Color='#000000')";
 filter: progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=0, Color='#000000');
 box-shadow:0 0 10px black;
 zoom:1;
}
var divCount=$divs.length;
对于(var i=0;i尝试以下方法:

$('.divs:not(:first)').filter(function(){
   return $(this).position().top - $(this).height() == 0
}).nextAll().andSelf().addClass('next')

什么是“流向第二行”?每行的编号是否始终相同?您知道“外部”的宽度吗div?我想选择第二行中的那些。我认为第一行中总是有相同的数字,第二行会改变,但我真的不想指望第一行中有相同的数字。是的,我知道外部div的宽度。对不起,我不太擅长使用jQuery。但是你的解决方案似乎很棒。我有这个。如果你能告诉我我做错了什么,那就太好了。谢谢!有趣的是,今天早上firefox 14的最新补丁在那个JSFIDLE上崩溃了。我不知道那里有什么(无法打开它,但立即导致崩溃:)。以上答案已编辑,以获取用法示例。
var divCount = $divs.length;
for(var i=0; i<divCount; i++) {
 if(true == arrOffsetTops[ i ].newLine) {
  $divs.eq( i ).addClass('newline-marker');
 }
}

.newline-marker {
 -webkit-box-shadow:0 0 10px black;
 -khtml-box-shadow:0 0 10px black;
 -moz-box-shadow:0 0 10px black;
 -o-box-shadow:0 0 10px black;
 -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=0, Color='#000000')";
 filter: progid:DXImageTransform.Microsoft.Shadow(Strength=2, Direction=0, Color='#000000');
 box-shadow:0 0 10px black;
 zoom:1;
}
$('.divs:not(:first)').filter(function(){
   return $(this).position().top - $(this).height() == 0
}).nextAll().andSelf().addClass('next')