W3.JS

W3.JS HTML 排序

对元素进行排序：

w3.sortHTML( selector)

列表排序

单击该按钮可按字母顺序对列表进行排序：

奥斯陆
斯德哥尔摩
赫尔辛基
柏林
罗马
马德里

示例

<button onclick="w3.sortHTML('#id01', 'li')">Sort</button>

<ul id="id01">
<li>Oslo</li>
<li>Stockholm</li>
<li>Helsinki</li>
<li>Berlin</li>
<li>Rome</li>
<li>Madrid</li>
</ul>

亲自试一试» 使用 CSS »

对表格进行排序

单击表格标题对表格进行相应排序：

姓名	国家
伯格伦德斯纳布科普	瑞典
北/南	英国
阿尔弗雷德·富特基斯特	德国
埃森国王	德国
里乌尼蒂食品杂志	意大利
巴黎特色菜	法国
岛屿贸易	英国
笑酒神巴克斯酒窖	加拿大

示例

<table id="myTable">
<tr>
    <th onclick="w3.sortHTML('#myTable','.item', 'td:nth-child(1)')">Name</th>
    <th onclick="w3.sortHTML('#myTable','.item', 'td:nth-child(2)')">Country</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 »