Как отсортировать баланс в таблице по возрастанию и убыванию?
Я пытался отсортировать баланс в таблице по возрастанию и убыванию, но не смог. Я просмотрел учебник w3schools и тему в stackoverflow о методах InsertBefore и InsertAfter без библиотек. Но это не работает. Мой код:
function sortTableByBalance() {
let table, rows, switching, i, x, y, shouldSwitch;
table = document.getElementById("myTable");
switching = true;
while (switching) {
switching = false;
rows = table.rows;
for (i = 1; i < rows.length - 1; i++) {
shouldSwitch = false;
x = rows[i].getElementsByTagName("TD")[2];
y = rows[i + 1].getElementsByTagName("TD")[2];
if (Number(x.innerHTML) > Number(y.innerHTML)) {
shouldSwitch = true;
break;
} else if (Number(x.innerHTML) < Number(y.innerHTML)) {
shouldSwitch = false;
break;
}
}
if (shouldSwitch) {
rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);
switching = true;
}
else if (!shouldSwitch) {
rows[i].parentNode.insertBefore(rows[i + 1], rows[i].nextSibling);
switching = true;
}
}
}
отредактировано. html, созданный с помощью js. могу показать тебе
Вы действительно используете плагин сортировки таблиц jquery, которым вы пометили вопрос?
Переупорядочение таблицы в DOM происходит очень медленно. Я бы предложил вам хранить данные в массиве JS, сортировать данные и заново создавать таблицу в DocumentFragment, а затем заменять текущую таблицу в DOM.
на самом деле, я пытался создать свою индивидуальную функцию InsertAfter, и я имел в виду свою функцию, а не плагин сортировщика таблиц jquery. извини. Отредактировано
если просто - создать ререндер?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Причина, по которой ваша таблица не сортируется, заключается в том, что вы выходите из цикла, когда пара балансов не равна. Очевидно, вы хотели реализовать своего рода пузырьковую сортировку, но при выходе из внутреннего цикла, когда вы устанавливаете от shouldSwitch до false, этот алгоритм реализуется неправильно: он не обнаружит, что следующая пара находится в неправильном порядке.
Итак, быстрое решение — изменить это:
} else if (Number(x.innerHTML) < Number(y.innerHTML)) {
shouldSwitch = false;
break;
к этому:
} else if (Number(x.innerHTML) < Number(y.innerHTML)) {
shouldSwitch = false;
Лучший подход
Однако вам не обязательно явно реализовывать алгоритм сортировки. Есть sort, и вы также можете положиться на него при сортировке этой таблицы:
function sortTableByBalance() {
const table = document.getElementById("myTable");
const arr = Array.from(table.rows, row => [row, +row.cells[2].textContent]).slice(1);
arr.sort(([,a], [,b]) => a - b);
for (const [elem] of arr) {
table.appendChild(elem);
}
}
Интересно, но когда я пытаюсь использовать Array.from, я получаю сообщение «Uncaught TypeError: невозможно прочитать свойства неопределенного значения (чтение «textContent»)». Я думаю, это потому, что у меня есть дополнительная строка, например, общий баланс. Ниже я покажу вам, как это выглядит
нет, я удалил общий баланс из Array.from с помощью среза (1, -1), но ошибка textContent и InternalHTML все еще существует
Эта ошибка означает, что в вашей таблице есть строка без ячейки в третьем столбце.
Я понял, почему js ругается, но не знаю, как это исправить. Он ругается на пустую ячейку в столбце, потому что все ненужные строки я удаляю срезом уже после вывода ячеек textContent этих строк.
Вы не предоставили HTML в своем вопросе, поэтому он выходит за рамки. Если у вас есть новый вопрос, я предлагаю вам опубликовать его как новый вопрос, указав проблемный HTML-код и то, что вы ожидаете, если в строке отсутствует ячейка, по которой вы хотите отсортировать (например: следует ли ее удалить, следует ли переместить в самый конец таблицы, на самый верх и т. д.). Буду рад посмотреть, если выложите.
Почему в комментариях код? Что такое HTML?