Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Сортировка элементов (https://javascript.ru/forum/dom-window/62038-sortirovka-ehlementov.html)

dimensi 21.03.2016 21:37
Сортировка элементов
 
Есть такой список
<div class='s'>
 <div class='item'>
     <div class='s1'>text</div>
     <div class='s2'>text</div>
     <div class='s3'>1232</div>
</div>
 <div class='item'>
     <div class='s1'>text</div>
     <div class='s2'>text</div>
     <div class='s3'>1232</div>
</div>
</div>

Как сделать сортировку по цифрам? Чтоб элемент item менял позицию в зависимости от значений цифр в блоке s3.
Заранее спасибо.
Я совершенно не знаю js :/ А готовых вариантов не нагуглил...

рони 21.03.2016 21:51
dimensi,
как выбрать блоки по селектору знаите?

dimensi 21.03.2016 21:54
Цитата:
Сообщение от рони (Сообщение 411622)
dimensi,
как выбрать блоки по селектору знаите?
var item = $('.s'); ?
или getElementById

рони 21.03.2016 22:02
dimensi,
а как взять текст текст в элементе? условно elem.???

рони 21.03.2016 22:07
Цитата:
Сообщение от dimensi
А готовых вариантов не нагуглил...
http://javascript.ru/forum/dom-windo...tml#post392060
http://javascript.ru/forum/jquery/39...tml#post259543

dimensi 21.03.2016 22:13
Нашел плагин TinySort он решил мою проблему.

рони 21.03.2016 22:14
dimensi,
пост 5 вторая ссылка ... изменены только селекторы на ваши ... и сортировка по числам а не строкам
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
  <script>
   $(window).load(function () {
    var c = jQuery.makeArray($(".s .item"));
    c.sort(function (a, b) {
        a = $(".s3",a).text();
        b = $(".s3",b).text();
        return a - b
    });
    $(c).appendTo(".s")
});
  </script>
</head>
<body>
  <div class='s'>
<div class='item'>
     <div class='s1'>text</div>
     <div class='s2'>text</div>
     <div class='s3'>4</div>
</div>
 <div class='item'>
     <div class='s1'>text</div>
     <div class='s2'>text</div>
     <div class='s3'>10</div>
</div>
 <div class='item'>
     <div class='s1'>text</div>
     <div class='s2'>text</div>
     <div class='s3'>1</div>
</div>
</div>

</body>
</html>

рони 21.03.2016 22:15
Цитата:
Сообщение от dimensi
Нашел плагин
:)


Часовой пояс GMT +3, время: 04:33.