W3.JS HTML 排序
排序元素
w3.sortHTML(选择器)
排序列表
点击按钮按字母顺序排序列表
- 奥斯陆
- 斯德哥尔摩
- Helsinki
- Berlin
- 罗马
- Madrid
示例
<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 | Sweden |
North/South | UK |
Alfreds Futterkiste | Germany |
Koniglich Essen | Germany |
Magazzini Alimentari Riuniti | Italy |
Paris specialites | France |
Island Trading | UK |
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>Sweden</td>
</tr>
<tr class="item">
<td>North/South</td>
<td>UK</td>
</tr>
<tr class="item">
<td>Alfreds Futterkiste</td>
<td>Germany</td>
</tr>
...
</table>
亲自尝试 » 使用 CSS »