JQuery: как вычислить максимальное значение атрибута для всех согласованных элементов?

Рассмотрим следующий HTML:

<div class="a" x="6"></div>
<div class="a" x="9"></div>
<div class="a" x="2"></div>
...
<div class="a" x="8"></div>

Как вы можете найти максимальное значение x для всех элементов .a?

Предположим, что все значения x являются положительными целыми числами.

Ответ 1

Просто переверните их:

var maximum = null;

$('.a').each(function() {
  var value = parseFloat($(this).attr('x'));
  maximum = (value > maximum) ? value : maximum;
});

Ответ 2

У меня есть другая версия:

var numbers = $(".a").map(function(){
    return parseFloat(this.getAttribute('x')) || -Infinity;
}).toArray();

$("#max").html(Math.max.apply(Math, numbers));

Это использует функцию карты для извлечения значений x-Attributes, преобразует объект в массив и предоставляет элементы массива в качестве функциональных параметров для Math.max

Уловка Math.max была украдена из http://ejohn.org/blog/fast-javascript-maxmin/

UPDATE

добавить "|| -Infinity", чтобы обработать случай правильно, если атрибут отсутствует. Смотрите скрипту @kubedan

Ответ 3

var max = null;

$('.a').each(function() {
  var x = +($(this).attr('x'));
  if (max === null || x > max)
    max = x;
}

alert(max === null ? "No matching elements found" : "The maximum is " + max);

Обратите внимание на унарный оператор +, чтобы преобразовать атрибут в число. Вы можете добавить некоторую проверку ошибок, чтобы убедиться, что это действительно число, и что этот атрибут существует вообще. Вы можете изменить селектор только для выбора элементов с классом и атрибутом: $('.a[x]').

Ответ 4

var max =0;
$('.a').each(function(){

    if(parseFloat($(this).attr('x'))>max)
    {
         max = parseFloat($(this).attr('x')) ;
    }
});

alert(max);

Ответ 5

Вы также можете использовать Array.sort в jQuery, как описано здесь, затем используйте $('. a: last'), чтобы получить выбранный элемент.

Ответ 6

Я делал некоторые тесты по этой теме, и если производительность имеет значение, старый, но золотой простой for был бы лучше, чем jQuery.map(), Math.apply(), а также Array.sort():

var items = $(".a");
for (var i = 0; i < items.length; i++) {
  var val = items.eq(i).prop('x');
  if (val > max) max = val;
}

Вот тесты jsperf: http://jsperf.com/max-value-by-data-attribute. Ничего серьезного, но интересного в любом случае.