Tri HTML W3.JS
Trier les éléments :
w3.sortHTML(selector)
Trier les listes
Cliquez sur le bouton pour trier la liste par ordre alphabétique :
- Oslo
- Stockholm
- Helsinki
- Berlin
- Rome
- Madrid
Exemple
<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>
Sort Tables
Cliquez sur les en-têtes de tableau pour trier le tableau en conséquence :
| Nom | Pays |
|---|---|
| La tasse rapide de Berglund | la Suède |
| Nord Sud | Royaume-Uni |
| La mangeoire d'Alfred | Allemagne |
| Nourriture royale | Allemagne |
| Entrepôts de nourriture rassemblés | Italie |
| Spécialités parisiennes | La France |
| Commerce insulaire | Royaume-Uni |
| Caves Bacchus qui rit | Canada |
Exemple
<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>