Classificação HTML W3.JS
Ordenar elementos:
w3.sortHTML(selector)
Classificar listas
Clique no botão para classificar a lista em ordem alfabética:
- Oslo
- Estocolmo
- Helsinque
- Berlim
- Roma
- Madri
Exemplo
<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>
Classificar tabelas
Clique nos cabeçalhos da tabela para classificar a tabela de acordo:
| Nome | País |
|---|---|
| A xícara rápida de Berglund | Suécia |
| Norte Sul | Reino Unido |
| A caixa de alimentação do Alfred | Alemanha |
| comida real | Alemanha |
| Armazéns de Alimentos Reunidos | Itália |
| Especialidades de Paris | França |
| Comércio de ilhas | Reino Unido |
| Adegas de Baco Rindo | Canadá |
Exemplo
<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>