HTML 表格排序：使用 JavaScript 和 FastUnit 的示例

HTML 表格排序

本示例展示了如何使用 JavaScript 和 FastUnit 对 HTML 表格进行排序。具体步骤如下：

1. 创建一个 HTML 表格，并为表头添加一个 onclick 事件处理程序。
2. 在事件处理程序中，使用 FastUnit 函数对表格数据进行排序。
3. 更新表格以反映已排序的数据。

代码示例：

  

    

      
姓名
      
年龄
    
  
  

    

      
John
      
30
    
    

      
Mary
      
25
    
  


[removed]
function sortTable(n) {
  var table, rows, switching, i, x, y, shouldSwitch;
  table = document.getElementsByTagName("table")[0];
  switching = true;
  /* 执行循环，直到没有交换发生 */
  while (switching) {
    // 将 switching 设为 false，因为它可能在循环内被设置回 true
    switching = false;
    rows = table.rows;
    /* 循环遍历所有行，除了第一行（标题）*/
    for (i = 1; i < (rows.length - 1); i++) {
      // 开始交换两位相邻行的内容
      shouldSwitch = false;
      /* 获取两个要比较的元素*/
      x = rows[i].getElementsByTagName("td")[n];
      y = rows[i + 1].getElementsByTagName("td")[n];
      /* 检查如果第一个元素应在第二个元素之后*/
      if (x[removed].toLowerCase() > y[removed].toLowerCase()) {
        // 如果是，则标记交换
        shouldSwitch = true;
        break;
      }
    }
    if (shouldSwitch) {
      /* 如果标记为交换，则交换两个行 */
      rows[i][removed].insertBefore(rows[i + 1], rows[i]);
      switching = true;
    }
  }
}
[removed]