Вернуться к уроку

Отсортировать таблицу

важность: 5

Есть таблица:

Имя Фамилия Отчество Возраст
Вася Петров Александрович 10
Петя Иванов Петрович 15
Владимир Ленин Ильич 9
... ... ... ...

Строк в таблице много: может быть 20, 50, 100… Есть и другие элементы в документе.

Как бы вы предложили отсортировать содержимое таблицы по полю Возраст? Обдумайте алгоритм, реализуйте его.

Как сделать, чтобы сортировка работала как можно быстрее? А если в таблице 10000 строк (бывает и такое)?

P.S. Может ли здесь помочь DocumentFragment?

P.P.S. Если предположить, что у нас заранее есть массив данных для таблицы в JavaScript – что быстрее: отсортировать эту таблицу или сгенерировать новую?

Для сортировки нам поможет функция sort массива.

Общая идея лежит на поверхности: сделать массив из строк и отсортировать его. Тонкости кроются в деталях.

В ифрейме ниже загружен документ, описывающий и реализующий разные алгоритмы. Обратите внимание: разница в производительности может достигать нескольких раз!

P.S. Создавать DocumentFragment здесь ни к чему. Можно вытащить из документа TBODY и иметь дело с ним в отрыве от DOM (алгоритм 4).

P.P.S. Если нужно сделать много узлов, то обычно innerHTML работает быстрее, чем удаление и вставка элементов через DOM-вызовы. То есть, сгенерировать таблицу заново эффективнее.

Открыть решение в песочнице.