選擇列表中最高的圖像

Question

使用jQuery選擇列表的最高圖像最簡單的方法是什麼？

結構：

<ul class="gallery"> 
    <li><img width="100px" height="300px" src="1.jpg"></li> 
    <li><img width="100px" height="200px" src="2.jpg"></li> 
    <li><img width="100px" height="500px" src="3.jpg"></li> 
</ul> 

Answer 1

// use anonymous function to prevent clutter of the scope 
(function() { 
    var max_height = 0; 
    var image = null; 

    $('.gallery li img').each(function() { 
     var cur_height = $(this).height(); 
     if (cur_height > max_height) { 
      max_height = cur_height; 
      image = this; 
     } 
    }); 

    // just an example 
    $(image).addClass('tallest'); 
})(); 

Answer 2

var height = 0, 
    img = null; 
$('img','.gallery').each(function() { 
    var h = $(this).height(); 
    if (h > height) { 
     height = h; 
     img = this; 
    } 
}); 

// img is the tallest image