尊重劳动成果，转载请注明出处（http://blog.csdn.net/sllailcp/article/details/41011173）...
点击button，表格里就会依照分数的高低。将学生信息从分数高的往分数低的排序；
完整案例（jQuery需自己引入）：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <script type="text/javascript" src="jquery-1.8.3.min.js"></script> <script type="text/javascript"> $(function(){ var num=[];var $tr=$('.tbody tr');var $tbody=$('.tbody');var $sheng=$('.da');$tr.each(function(index, element) { for(var i=0;i<$tr.length;i++){ num[i]=$tr.eq(i).find('td:nth-child(4)').html();} });$sheng.click(function(e) { for(var i=0;i<num.length;i++){ for(var j=i+1;j<num.length;j++){ //从大到小排序/ if(num[i]<num[j]){ var ss=num[i];num[i]=num[j];num[j]=ss;var ss01=$tr[i];$tr[i]=$tr[j];$tr[j]=ss01;}}}$tbody.each(function(index, element) { for(var i=0;i<$tr.length;i++){ $(this).append($tr[i])}}); }); }) </script> </head> <body> <table width="200" border="1"><thead> <tr> <th>学号</th> <th>姓名</th> <th>年龄</th> <th>分数</th> <th>大写</th> </tr> </thead> <tbody class="tbody"> <tr> <td>1</td> <td>张三</td> <td>12</td> <td bgcolor="#FF0000">45</td> <td>SS</td> </tr> <tr> <td>2</td> <td>李四</td> <td>34</td> <td bgcolor="#FF0000">41</td> <td>WW</td> </tr> <tr> <td>3</td> <td>王五</td> <td>54</td> <td bgcolor="#FF0000">21</td> <td>S</td> </tr> <tr> <td>4</td> <td>赵六</td> <td>22</td> <td bgcolor="#FF0000">2</td> <td>DC</td> </tr> <tr> <td>5</td> <td>钱七</td> <td>21</td> <td bgcolor="#FF0000">78</td> <td>GHG</td> </tr> </tbody> </table> <button class="da">按分数排序</button> </body> </html>正常的学生信息：
排序后的学生信息：
版权声明：本文博主原创文章。博客，未经同意不得转载。