Как использовать методы сортировки в jQuery?

Пользователь

от jose , в категории: JavaScript , год назад

Как использовать методы сортировки в jQuery?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от vicenta_kertzmann , год назад

@jose 

jQuery - это библиотека JavaScript, которая упрощает многие задачи веб-разработки, в том числе сортировку элементов на странице. Для сортировки элементов в jQuery используются методы сортировки, которые доступны через объект $.fn (или jQuery.fn).


Вот несколько примеров использования методов сортировки в jQuery:

  1. Сортировка элементов списка в алфавитном порядке
1
2
3
4
5
6
7
8
9
var items = $('ul li').get();
items.sort(function(a, b) {
    var compA = $(a).text().toUpperCase();
    var compB = $(b).text().toUpperCase();
    return (compA < compB) ? -1 : (compA > compB) ? 1 : 0;
});
$.each(items, function(i, li){
    $('ul').append(li);
});


  1. Сортировка таблицы по столбцу
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
$('table th').click(function(){
    var table = $(this).parents('table').eq(0);
    var rows = table.find('tr:gt(0)').toArray().sort(compare($(this).index()));
    this.asc = !this.asc;
    if (!this.asc){rows = rows.reverse();}
    for (var i = 0; i < rows.length; i++){
        table.append(rows[i]);
    }
});

function compare(idx) {
    return function(a, b) {
        var valA = getCellValue(a, idx), valB = getCellValue(b, idx);
        return $.isNumeric(valA) && $.isNumeric(valB) ? valA - valB : valA.localeCompare(valB);
    }
}
function getCellValue(row, idx){ 
    return $(row).children('td').eq(idx).text(); 
}


  1. Сортировка элементов по их атрибутам
1
2
3
4
5
6
7
8
9
var items = $('.item').get();
items.sort(function(a, b) {
    var compA = $(a).attr('data-price');
    var compB = $(b).attr('data-price');
    return (compA < compB) ? -1 : (compA > compB) ? 1 : 0;
});
$.each(items, function(i, li){
    $('.container').append(li);
});


В этих примерах используются различные методы сортировки, включая sort(), localeCompare(), get() и другие. Выбор метода зависит от вашего конкретного случая использования и того, что вы хотите отсортировать.