JavaScript 表格行排序：按 TD 內 H6 數值大小重新排列 TR

需求

表格每行第一列含 <h6>數字</h6>，需按數字大小對整行 <tr> 重新排序。

原生 JS 實現（降序）

<table id="tb">
  <tr><td><h6>123</h6></td></tr>
  <tr><td><h6>456</h6></td></tr>
  <tr><td><h6>789</h6></td></tr>
  <tr><td><h6>100</h6></td></tr>
</table>
<script>
const tb = document.getElementById('tb');
const rows = Array.from(tb.rows).slice(1); // 若有表頭跳過
rows.sort((a, b) => {
    const valA = parseInt(a.cells[0].querySelector('h6').textContent.trim());
    const valB = parseInt(b.cells[0].querySelector('h6').textContent.trim());
    return valB - valA; // 降序；升序用 valA - valB
});
rows.forEach(tr => tb.appendChild(tr)); // 移動現有節點實現重排
</script>

jQuery 版（兼容舊專案）

const $tb = $('#tb');
const $rows = $tb.find('tr').get();
$rows.sort((a, b) => {
    const valA = parseInt($(a).find('h6').text().replace(/\s/g, ''));
    const valB = parseInt($(b).find('h6').text().replace(/\s/g, ''));
    return valB - valA;
});
$tb.append($rows);

進階：可點擊表頭切換升降序

let asc = true;
$('#tb th').click(function() {
    const idx = $(this).index();
    const $rows = $('#tb tbody tr').get();
    $rows.sort((a, b) => {
        const valA = parseFloat($(a).find('td').eq(idx).text());
        const valB = parseFloat($(b).find('td').eq(idx).text());
        return asc ? valA - valB : valB - valA;
    });
    $('#tb tbody').append($rows);
    asc = !asc;
});