jQuery獲取數組的特定屬性

Question

我有一個圖像元素的數組，我想找到最大的高度值。

所以，如果我有

[ 
    <img src="image1.jpg" width="300" height="400" />, 
    <img src="image2.jpg" width="200" height="500" />, 
    <img src="image3.jpg" width="100" height="200" /> 
] 

我需要的數量是500。

達到此目的的最佳方法是什麼？

Answer 1

您也可以嘗試這種策略，假設你的圖像存儲在陣列「IMGS」：

var maxHeight = Math.max.apply({}, imgs.map(function(x){return x.height})); 
maxHeight; // => 500 

Answer 2

我假設你真的有一個img元素實例（你已經顯示的可以採取任何方式，元素或字符串，但你沒有引用它們，所以...）的數組。

你也可以使用jQuery的$.each：

var maxHeight = -1; 
$.each(theArray, function() { 
    if (maxHeight < this.height) { 
     maxHeight = this.height; 
    } 
}); 

或者，如果你已經有了陣列包裹在一個jQuery對象：

var theArray = $('img'); // A jQuery object wrapped around an array of all `img`s 

...那麼你可以使用each（這是稍微不同於$.each）：

var maxHeight = -1; 
theArray.each(function() { 
    if (maxHeight < this.height) { 
     maxHeight = this.height; 
    } 
}); 

或者只是使用一個無聊的老式循環：

var index, maxHeight; 
maxHeight = -1; 
for (index = 0; index < theArray.length; ++index) { 
    if (maxHeight < theArray[index].height) { 
     maxHeight < theArray[index].height; 
    } 
} 

在上述所有的，我已經使用了HTMLImageElement的height property由DOM指定。或者，您可能更喜歡jQuery的height()函數（如果是這樣，不要忘記將元素包裝在jQuery對象  —，例如$(this).height()），但通常height（屬性）是您需要的所有元素和img元素。

Answer 3

比方說，你的圖像在一個陣列稱爲：

a.sort(function(a,b) {return $(a).height() < $(b).height() }) ; 
alert($(a[0]).height()) ; 

確保你的圖像標籤有單引號：

a = [ 
    '<img src="image1.jpg" width="300" height="400" />', 
    '<img src="image2.jpg" width="200" height="500" />', 
    '<img src="image3.jpg" width="100" height="200" />' 
] ;