Как отсортировать неупорядоченный список внутри тега привязки

Question

У меня есть следующая структура DOM (неупорядоченный список), которую я хотел бы отсортировать по имени тега a href, используя jQuery.

Структура выглядит следующим образом:

<div id="refmenu">
<ul id="list">
<li><a href="....">Google</a></li>
<li><a href="....">Apple</a></li>
<li><a href="....">IBM</a></li>
<li><a href="....">Yahoo!</a></li>
<li><a href="....">Hotmail</a></li>
</ul>
</div>

Исходя из вышеизложенного, хотелось бы иметь возможность выполнить это через функцию jQuery, которая будет сортировать неупорядоченные имена списков в алфавитном порядке, очевидно, также сохраняя ссылку a href вместе с именами тегов привязки.

Надеюсь, что кто-то может помочь.

Спасибо.

Answer 1

Плагин TinySort Плагин, он сортирует дочерние узлы по содержимому или атрибутам: Пример

Edit-

$("div#refmenu>ul#platsys>li").tsort("a.title"); 

Также нет никаких причин для дополнительной фильтрации до идентификатора , выбирающего по имени тега не не ускоряет производительность при выборе по id. Также ваше имя для вашего ul не platsys, поэтому я не знаю, откуда вы взяли, что должно быть ul # list> li , но чтобы сократить все лишние ненужные код у меня будет

$("#refmenu>#list>li").tsort("a.title");

на самом деле из вашего html, я думаю, это будет так же, как:

$("#list>li").tsort("a.title");

Answer 2

вы можете попробовать List.js , который расширит ваш список функций до крайности как

1. это легкий [только 3K скрипт]
2. легко внедрить в существующую таблицу HTML с помощью класса
3. с возможностью поиска, сортировки и фильтрации

HTML

<div id="my-list">
    <ul class="list">
       <li>
           <h3 class="name">Luke</h3>
       </li>
       <li>
           <h3 class="name">John</h3>
       </li>
    </ul>
</div>

Javascript

var options = {
    valueNames: ['name']
};
var myList = new List('my-list', options);

Answer 3

Попробуйте это:

var list = $("#list"),
    listItems = Array.prototype.slice.call(list.find("li"));
listItems.sort(function(a, b) {
    a = $("a", a).text(), b = $("a", b).text();
    return a < b ? -1 : a > b ? 1 : 0;
});
listItems.forEach(function(val) {
    list.append($(val).remove());
});

Если вы хотите выполнить сортировку по критерию, отличному от текста привязки, замените text() на любой другой.

Answer 4

Наверняка все ваши href здесь начнутся с http: // или www? Как поможет сортировка?

Разве заказанный список не справился бы с работой?