Copy codeThe Code is as follows:
<Script type = "text/javascript">
Var B = true;
Function sortAge (){
Var tabNode = document. getElementsByTagName ("table") [0];
Var trNodes = tabNode. rows; // obtain the row object in the table.
Var arr = new Array ();
For (var x = 1; x <trNodes. length; x ++) {// The Temporary Container stores a reference to the row object in the table.
Arr [x-1] = trNodes [x];
}
Sort (arr );
Var tbdNode = tabNode. childNodes [0];
If (B) {// if... else... sort by age
For (var x = 0; x <arr. length; x ++ ){
TbdNode. appendChild (arr [x]);
}
B = false;
} Else {
For (var x = arr. length-1; x> = 0; x --){
TbdNode. appendChild (arr [x]);
}
B = true;
}
}
Function sort (arr) {// sort
For (var x = 0; x <arr. length; x ++ ){
For (var y = x + 1; y <arr. length; y ++ ){
If (parseInt (arr [x]. cells [1]. innerText)> parseInt (arr [y]. cells [1]. innerText) {// parseInt conversion is not performed using string ASCII comparison
Var temp = arr [x];
Arr [x] = arr [y];
Arr [y] = temp;
}
}
}
}
</Script>
<Style type = "text/css">
Table {width: 60%; border: solid 1px # 0066FF ;}
Table td {border: solid 1px # 0099ff ;}
A {text-decoration: none ;}
</Style>
</Head>
<Body>
<Table>
<Tr>
<Td> name </td> <a href = "javascript: void (0)" onclick = "sortAge () "> age </a> </td> <td> address </td>
</Tr>
<Tr>
<Td> Zhang San </td> <td> 23 </td> <td> Beijing </td>
</Tr>
<Tr>
<Td> Li Si </td> <td> 25 </td> <td> Shanghai </td>
</Tr>
<Tr>
<Td> Wang Wu </td> <td> 15 </td> <td> Guangzhou </td>
</Tr>
<Tr>
<Td> Tang Zong </td> <td> 20 </td> <td> Changsha </td>
</Tr>
</Table>
</Body>