Document<br>window.onload = function(){<br> var input = document.querySelectorAll ('input');<br> var table = document.querySelector('table');<br> var rows = table.tBodies[0].rows;<br> var arrRows = [];<br> /* Da Arrays nur sortiert werden können, fügen Sie alle tr in das Array ein */<br> for(var i = 0; i < rows.length; i++){<br/> arrRows.push(rows[i]); <br/> }<br/> // arrRows.sort(function(a,b){<br/> // return b.cells[1].innerHTML - a.cells[1].innerHTML;<br/> // / / Sortieren Sie nach dem Inhalt in der ersten Zelle in tr<br/> // });<br/> // arrRows.forEach(function(tr){<br/> // //Neu entsprechend der Sortierreihenfolge Put tr into tbody<br/> // table.tBodies[0].appendChild(tr);<br/> // });<br/> //console.log(arrRows);<br/> input[0]. function(){<br/> arrRows.sort(function(a,b){<br/> return b.cells[1].innerHTML - a.cells[1].innerHTML;<br/> //Nach tr Sortieren Inhalt in der ersten Zelle <br/> });<br/> arrRows.forEach(function(tr){<br/> //Ersetze tr in der Reihenfolge der Sortierung in die tbody<br/>-Tabelle .tBodies[0].appendChild( tr);<br/> });<br/> }<br/> input[1].onclick = function(){<br/> arrRows.sort(function(a,b){<br/> return a.cells[1 ].innerHTML - b.cells[1].innerHTML;<br/> //Sortieren nach dem Inhalt der ersten Zelle in tr<br/> });<br/> arrRows .forEach(function(tr){<br/> //Ersetze tr in tbody<br/> entsprechend der Reihenfolge der Zahlen) table.tBodies[0].appendChild(tr);<br/> });<br/> } <br/>}; ;<br/></head><br><body><br><table border="1" width="400" align="center"> ;<br/> <thead><br> < ;tr><br> <th>Früchte</th><br> <th>Stückpreis (¥)</th><br> </ tr><br> </thead><br> <tbody><br> <tr><br> <th>Apple</th><br> <th>54,5</th> <br> </tr><br> < tr><br> <th>Orange</th><br> <th>24,5</th><br> </tr><br> <tr><br> <th>Wassermelone< ;/th><br> <th>33,8</th><br> </tr><br> <tr><br> <th>Banane</th><br> <th> ;13.8</th><br> </tr><br> </tbody><br> <tfoot><br> < ;tr><br> <td colspan="2" style= "text-align: center;"><br> <input type="button" value="Preise werden von hoch nach niedrig sortiert"><br> <input type="button" value="Preis ab niedrig bis hoch"><br> </td><br> </tr><br> </tfoot><br>< ;/table> <br></body><br>< ;/html><br></p>