Sắp xếp HTML W3.JS
Sắp xếp các phần tử:
w3.sortHTML( selector )
Sắp xếp danh sách
Bấm vào nút để sắp xếp danh sách theo thứ tự bảng chữ cái:
- Oslo
- X-tốc-khôm
- Helsinki
- Béc-lin
- la Mã
- Madrid
Ví dụ
<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>
Hãy tự mình thử » Với CSS »Sắp xếp bảng
Nhấp vào tiêu đề bảng để sắp xếp bảng cho phù hợp:
Tên | Quốc gia |
---|---|
Berglunds snabkop | Thụy Điển |
Bắc Nam | Vương quốc Anh |
Alfred Futterkiste | nước Đức |
Koniglich Essen | nước Đức |
Magazzini Alimentari Riuniti | Nước Ý |
Đặc sản Paris | Pháp |
Giao dịch đảo | Vương quốc Anh |
Hầm rượu Bacchus cười | Canada |
Ví dụ
<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>
Hãy tự mình thử » Với CSS »