每个元素的宽度

Question

我找不到解决方案。 如何循环遍历从宽度最大的元素开始的所有元素（本例中为elname_03类的元素）。

我有几个div元素具有相同的类名称，我正在循环它们。

也许有一个选择器来做到这一点？

<div class="el elname_01"></div> 
<div class="el elname_03"></div> 
<div class="el elname_02"></div> 
<div class="el elname_03"></div> 
<div class="el elname_02"></div> 
<div class="el elname_03"></div> 

• elname_01 - 宽100px的
• elname_02 - 宽150像素
• elname_03 - 宽200像素

我需要开始从elname_03检查，毕竟他们通过循环通过，则我需要循环所有02号码。我想用一个each来做到这一点，如果可能的话，因为我从json解析数据。

Answer 1

您可以尝试进行排序jQuery对象的数组，然后遍历它：

​var items = $('div'); 
Array.prototype.sort​​​​​​​​​.call(items, function(a,b){ 
    return b.offsetWidth - a.offsetWidth; 
}); 

items.each(function() { 
    console.log(this); 
}); 

这里的工作的jsfiddle：http://jsfiddle.net/7BzH4/

Answer 2

这是一个指导性答案。它可以得到改善。

但是这是基本的想法：

http://jsbin.com/aliqam/2/edit

<input class="a" style="width:10px";/> 
  <input class="b" style="width:100px";/> 
  <input class="c" style="width:40px";/> 

function SortBySize(a, b) 
{ 
    var aName = parseInt($(a).width()); 
    var bName = parseInt($(b).width()); 
    return((aName < bName) ? -1 : ((aName > bName) ? 1 : 0)); 
} 

让测试：

前：

console.log($("input").eq(0).width()) 
console.log($("input ").eq(1).width()) 
console.log($("input").eq(2).width()) 

var gg = $("input").get().sort(SortBySize); 

后：

console.log($(gg).eq(0).width()) 
console.log($(gg).eq(1).width()) 
console.log($(gg).eq(2).width()) 

Answer 3

试试这个让你与最大宽度的div：

var maxWidth = Math.max.apply(null, $('div.el').map(function() { 
    return $(this).outerWidth(true); 
}).get()); 

alert(maxWidth);​ 

DEMO：http://jsfiddle.net/UBdAS/