W3.JS HTML 排序
排序元素
w3.sortHTML(selector)
排序列表
点击按钮按字母顺序排序列表
- 奥斯陆
- 斯德哥尔摩
- 赫尔辛基
- 柏林
- 罗马
- 马德里
示例
<button onclick="w3.sortHTML('#id01', 'li')">排序</button>
<ul id="id01">
<li>奥斯陆</li>
<li>斯德哥尔摩</li>
<li>赫尔辛基</li>
<li>柏林</li>
<li>罗马</li>
<li>马德里</li>
</ul>
亲自试一试 » 带 CSS »排序表格
点击表头相应地排序表格
| 名称 | 国家 |
|---|---|
| Berglunds snabbkop | 瑞典 |
| North/South | 英国 |
| Alfreds Futterkiste | 德国 |
| Koniglich Essen | 德国 |
| Magazzini Alimentari Riuniti | 意大利 |
| Paris specialites | 法国 |
| Island Trading | 英国 |
| Laughing Bacchus Winecellars | 加拿大 |
示例
<table id="myTable">
<tr>
<th onclick="w3.sortHTML('#myTable','.item', 'td:nth-child(1)')">名称</th>
<th onclick="w3.sortHTML('#myTable','.item', 'td:nth-child(2)')">国家</th>
</tr>
<tr class="item">
<td>Berglunds snabbkop</td>
<td>瑞典</td>
</tr>
<tr class="item">
<td>North/South</td>
<td>英国</td>
</tr>
<tr class="item">
<td>Alfreds Futterkiste</td>
<td>德国</td>
</tr>
...
</table>
亲自试一试 » 带 CSS »
