Отсортировать массив js

Сергей

Как отсортировать такой массив с эелементами списка по значению по алфавиту?

<li name="Дн026" id="Т_26" class="hood" style="display: none;">20 лет Победы</li>
<li name="Дн025" id="Т_25" class="hood" style="display: none;">Семафорная</li>
<li name="Дн018" id="Т_18" class="hood" style="display: none;">Платонова</li>
<li name="Дн015" id="Т_15" class="hood" style="display: none;">Карла Маркса</li>
<li name="Дн014" id="Т_14" class="hood" style="display: none;">Пастера</li>
<li name="Дн080" id="Т_80" class="hood" style="display: none;">Глинки</li>
2 ответа

Сергей

  • взять все li из ul
  • отсортировать их по textContent
  • вставить обратно в ul в отсортированном порядке

Пример реализации на базе этого ответа:

var parent = document.querySelector("ul");
var elements = parent.querySelectorAll("li");
var sortedElements = Array.from(elements).sort(function(a, b) {
  var c = a.textContent;
  var d = b.textContent;
  return c < d ? -1 : c > d ? 1 : 0;
});
for (let element of sortedElements) {
  parent.appendChild(element);
}
<ul>
  <li name="Дн026" id="Т_26" class="hood">20 лет Победы</li>
  <li name="Дн025" id="Т_25" class="hood">Семафорная</li>
  <li name="Дн018" id="Т_18" class="hood">Платонова</li>
  <li name="Дн015" id="Т_15" class="hood">Карла Маркса</li>
  <li name="Дн014" id="Т_14" class="hood">Пастера</li>
  <li name="Дн080" id="Т_80" class="hood">Глинки</li>
</ul>


Сергей

var cnt = document.getElementById('cnt');
var list = document.querySelectorAll('.hood');

cnt.innerHTML = [].slice.call(list).sort(function(a, b) {
  return a.textContent > b.textContent ? 1 : -1;
}).map(function(elm) {
  return elm.outerHTML;
}).join('');
<ul id="cnt">
  <li name="Дн026" id="Т_26" class="hood">20 лет Победы</li>
  <li name="Дн025" id="Т_25" class="hood">Семафорная</li>
  <li name="Дн018" id="Т_18" class="hood">Платонова</li>
  <li name="Дн015" id="Т_15" class="hood">Карла Маркса</li>
  <li name="Дн014" id="Т_14" class="hood">Пастера</li>
  <li name="Дн080" id="Т_80" class="hood">Глинки</li>
</ul>

Логика вся как в ответе Regent, только покомпактнее и всё содержимое ul сразу.

licensed under cc by-sa 3.0 with attribution.