Javascript 来自元素数组的jQuery最小/最大属性

Javascript 来自元素数组的jQuery最小/最大属性,javascript,jquery,arrays,Javascript,Jquery,Arrays,有没有一种简单的方法可以从jQuery中的元素数组中找到min/max属性 我经常发现自己根据最小值和最大值动态调整元素组的大小。大多数情况下,这与元素的宽度和/或高度有关,但我确信这可以应用于元素的任何属性 我通常会这样做: var maxWidth = 0; $('img').each(function(index){ if ($(this).width() > maxWidth) { maxWidth = $(this).width(); } }); var maxWidth =

有没有一种简单的方法可以从jQuery中的元素数组中找到min/max属性

我经常发现自己根据最小值和最大值动态调整元素组的大小。大多数情况下,这与元素的宽度和/或高度有关,但我确信这可以应用于元素的任何属性

我通常会这样做:

var maxWidth = 0;

$('img').each(function(index){
if ($(this).width() > maxWidth)
{
maxWidth = $(this).width();
}
});
var maxWidth = $('img').max('width');
但看起来你应该可以做这样的事情:

var maxWidth = 0;

$('img').each(function(index){
if ($(this).width() > maxWidth)
{
maxWidth = $(this).width();
}
});
var maxWidth = $('img').max('width');
jQuery中是否存在此功能,或者有人可以解释如何创建一个基本插件来实现此功能

谢谢

看一下,也许它能帮你解决问题。 它们提供了许多数学函数,比如DOM元素上的min、max和avg

示例:

$("input[name^='min']").min();
$("input[name^='max']").max();
使用

谷歌、雅虎和必应三个徽标的示例

HTML

附言:

实际上有一个确定最高元素的示例


它基本上就是你在这里所拥有的,只是为了方便访问而加入了一个插件。也许您可以将其用于您的用途。

作为插件卷起,以返回最小最大宽度和高度:

// Functions to get the Min & Max value in Array

if (!Array.min) { Array.min = function( array ){return Math.min.apply( Math, array )} }
if (!Array.max) { Array.max = function( array ){return Math.max.apply( Math, array )} }

(function( $ ){     // Standard jQuery closure to hide '$' from other libraries.

    // jQuery plug-in to get the min and max widths of a set of elements

    $.fn.dimensionsMinMax = function(whnx) {

    /*
    ################################################################################

    Name
    ====

        dimensionsMinMax(whnx) - jQuery plug-in to get min & max width & height

    Parameters
    ==========

        whnx - A 4-element array to receive the min and max values of the elements:
            whnx[0] = minimum width;
            whnx[1] = maximum width;
            whnx[2] = minimum height;
            whnx[3] = maximum height.

    Returns
    =======

        this - so it can be "chained".

    Example
    =======

        var minmax = new Array(4);
        var number_of_images = $('img').dimensionsMinMax(minmax).class('abc').length;
        console.log('number of images = ', number_of_images);
        console.log('width  range = ', minmax[0], ' to ', minmax[1]);
        console.log('height range = ', minmax[2], ' to ', minmax[3]);

    ################################################################################  
    */
        var  widths = new Array(this.length);
        var heights = new Array(this.length);

        this.each(function(i){
            $this      = $(this);
             widths[i] = $this.width();
            heights[i] = $this.height(); 
        });

        whnx[0] = Array.min( widths);
        whnx[1] = Array.max( widths);
        whnx[2] = Array.min(heights);
        whnx[3] = Array.max(heights);

        return this;
    }

})( jQuery );   // End of standard jQuery closure.

我喜欢jQuery文档中发布的优雅的解决方案,它是一个
.map()
示例,介绍了如何使用。我基本上适应了它的宽度和制作


我写了一个简单的插件来实现这一点-请参阅。安装后,您可以执行以下操作:


var maxWidth=$('img')。聚合('width','max')

您可以在OO上下文之外使用
apply
,无需扩展原型:

var maxHeight = Math.max.apply( null,
        $('img').map(function(){ return $(this).height(); }).get() );
您可以使用本机“sort”函数对比较的元素进行更多控制

Array.prototype.deepMax = function(comparator){
  if(typeof comparator === 'function'){
    var sorted = this.slice(0).sort(comparator);
    return sorted[sort.length - 1];
  }
  return Math.max.apply(Math, this);
};
你可以这样称呼它

var maxWidth = $('img').deepMax(function(a, b){
  //-1 if a < b; +1 otherwise
  return $(a).width() - $(b).width();
});

更简单:
var-widths=$('img').map(函数(){return$(this.width();}).get()演示:喜欢这个答案,谢谢!感谢:-避免猴子修补数组-链接到jQuery文档中的示例-使用jQuery插件
var maxWidth = $('img').deepMax(function(a, b){
  //-1 if a < b; +1 otherwise
  return $(a).width() - $(b).width();
});
Array.prototype.max = function(iterator){
  if(!iterator && obj[0] === +obj[0])
    return Math.max.apply(Math, this);
  var result = -Infinity, lastComputed = -Infinity;
  this.forEach(function(value, index){
    var computed = iterator ? iterator(value, index, this) : value;
    computed > lastComputed && (result = value, lastComputed = computed);
  });
  return result;
};

var maxWidth = $('img').max(function(val){ return $(val).width();});