</> Praktum

Главная / JavaScript / Сортировка уже показанного списка

Урок 26 · JavaScript

Переставить элементы, которые есть на странице

Список задач или карточек можно упорядочить по имени, не запрашивая его заново.

Почему это следующий шаг

Вкладки меняют панели. Сортировка меняет порядок внутри одной панели.

Как сделать

Собери элементы в массив через spread и querySelectorAll. Отсортируй массив по textContent и локали ru. Потом append каждый элемент обратно в тот же список: существующий узел при этом переедет, а не скопируется. Обработчики на элементах сохранятся.

const items = [...list.children];
items.sort((a, b) => a.textContent.localeCompare(b.textContent, "ru"));
items.forEach((item) => list.append(item));

Что проверить

  • Повторный запуск не плодит копии.
  • Порядок меняется у видимых пунктов.
  • Пустой список не вызывает ошибку.

Попробуй

Отсортируй пять пунктов по алфавиту одной кнопкой.