js实现table多行选择，多行排序

实现 table 多行选择和多行排序可以使用 JavaScript。下面是具体的代码实现：

多行选择：

<!-- HTML -->
<table id="myTable">
  <tr>
    <th>姓名</th>
    <th>年龄</th>
  </tr>
  <tr>
    <td>张三</td>
    <td>20</td>
  </tr>
  <tr>
    <td>李四</td>
    <td>22</td>
  </tr>
  <tr>
    <td>王五</td>
    <td>21</td>
  </tr>
</table>

// JavaScript
const table = document.getElementById("myTable");
let selectedRows = [];

table.addEventListener("click", function(event) {
  const target = event.target;
  const row = target.parentNode;
  
  if (row.nodeName === "TR" && row !== table.rows[0]) {
    if (selectedRows.includes(row)) {
      // 已经选中，取消选择
      selectedRows = selectedRows.filter(r => r !== row);
      row.classList.remove("selected");
    } else {
      // 未选中，添加选择
      selectedRows.push(row);
      row.classList.add("selected");
    }
  }
});

多行排序：

<!-- HTML -->
<table id="myTable">
  <thead>
    <tr>
      <th>姓名</th>
      <th>年龄</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>张三</td>
      <td>20</td>
    </tr>
    <tr>
      <td>李四</td>
      <td>22</td>
    </tr>
    <tr>
      <td>王五</td>
      <td>21</td>
    </tr>
  </tbody>
</table>

// JavaScript
const table = document.getElementById("myTable");

table.addEventListener("click", function(event) {
  const target = event.target;
  const th = target.closest("th");
  
  if (th) {
    const columnIndex = [...th.parentNode.children].indexOf(th);
    const rows = [...table.tBodies[0].rows];
    
    rows.sort((a, b) => {
      const aValue = a.cells[columnIndex].textContent;
      const bValue = b.cells[columnIndex].textContent;
      
      if (isNaN(aValue) || isNaN(bValue)) {
        return aValue.localeCompare(bValue);
      } else {
        return aValue - bValue;
      }
    });
    
    table.tBodies[0].append(...rows);
  }
});

以上代码分别实现了 table 的多行选择和多行排序功能。其中，多行选择通过监听 table 的 click 事件，并通过 selectedRows 数组来记录选中的行。多行排序则通过监听 table 的 click 事件，并通过 sort() 方法和 localeCompare() 方法对 tbody 中的行进行排序。