选择列表的最高图像

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