回到课程

可排序表格

重要程度: 4

让表格可以排序:单击 <th> 元素让对应的列自动排序。

每个 <th> 都有类型属性,如下所示:

<table id="grid">
  <thead>
    <tr>
      <th data-type="number">Age</th>
      <th data-type="string">Name</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>5</td>
      <td>John</td>
    </tr>
    <tr>
      <td>10</td>
      <td>Ann</td>
    </tr>
    ...
  </tbody>
</table>

在上面的例子中,第一列为数字,第二列为 —— 字符串。排序函数应根据类型进行排序。

应该只支持 "string""number" 类型。

运行示例:

P.S. 表可以很大,有任意数量的行和列。

打开一个任务沙箱。