怎样实现javascript对table的td进行升降序排序？

http://blog.csdn.net/guaxixi627/archive/2007/08/02/1722768.aspxsort.js
/**//**
* table排序
* anthor liueh
*/
function   JM_PowerList(colNum)
  {
  headEventObject=event.srcElement;//取得引发事件的对象
  while(headEventObject.tagName!="TR")   //不是tr行,则从底下的td冒泡上来寻找到相应行
  {
  headEventObject=headEventObject.parentElement;
  }

  for   (i=0;i<headEventObject.children.length;i++)
  {
  if   (headEventObject.children[i]!=event.srcElement)//找到事件发生的td单元格
  {
  headEventObject.children[i].className='listTableHead';//把点击的列的className属性设为listTableHead
  }
  }

  var   tableRows=0;
  trObject=clearStart.children[0].children;   //取得表格中行对象,   原来这里叫DataTable,   可能是你写错了吧??
  for   (i=0;i<trObject.length;i++)
  {
  Object=clearStart.children[0].children[i];//取得每行的对象
  tableRows=(trObject[i].id=='ignore')?tableRows:tableRows+1;//如果不是忽略行,则行数加一
  }

  var   trinnerHTML=new   Array(tableRows);
  var   tdinnerHTML=new   Array(tableRows);
  var   tdNumber=new   Array(tableRows)
  var   i0=0
  var   i1=0
  for   (i=0;i<trObject.length;i++)
  {
  if   (trObject[i].id!='ignore')
  {
  trinnerHTML[i0]=trObject[i].innerHTML;//把行放在数组里
  tdinnerHTML[i0]=trObject[i].children[colNum].innerHTML;//把要排序的行中td的内容放数组里
  tdNumber[i0]=i;//行号
  i0++;//加一,下个循环用
  }
  }
  sourceHTML=clearStart.children[0].outerHTML;//取得表格中所有tr的html代码

  //对所有td中的字符串进行排序,   算不算冒泡排序???
  for   (bi=0;bi<tableRows;bi++)
  {
  for   (i=0;i<tableRows;i++)
  {
  if(tdinnerHTML[i]>tdinnerHTML[i+1])
  {
  t_s=tdNumber[i+1];
  t_b=tdNumber[i];
  tdNumber[i+1]=t_b;
  tdNumber[i]=t_s;
  temp_small=tdinnerHTML[i+1];
  temp_big=tdinnerHTML[i];
  tdinnerHTML[i+1]=temp_big;
  tdinnerHTML[i]=temp_small;
  }
  }
  }



  var   showshow='';
  var   numshow='';
  for   (i=0;i<tableRows;i++)
  {
  showshow=showshow+tdinnerHTML[i]+' ';//把排序好的td的内容存在showshow字串里
  numshow=numshow+tdNumber[i]+'|';             //把排序好的相应的行号也存在numshow中
  }

  sourceHTML_head=sourceHTML.split("<TBODY>");//从<TBODY>截断,我试了,前头串为空

  numshow=numshow.split("|");
  var   trRebuildHTML='';
  if   (event.srcElement.className=='listHeadClicked')
  {//已点击的列,   则逆排
  for   (i=0;i<tableRows;i++)
  {
  trRebuildHTML=trRebuildHTML+trObject[numshow[tableRows-1-i]].outerHTML;//取出排序好的tr的内容连接起来

  }
  event.srcElement.className='listHeadClicked0';
  }
  else
  {//默认顺排,新点击顺排
  for   (i=0;i<tableRows;i++)
  {
  trRebuildHTML=trRebuildHTML+trObject[numshow[i]].outerHTML;
  }
  event.srcElement.className='listHeadClicked';
  }
  //取得排序后的tr集合结果字符串
  var   DataRebuildTable='';
  //把旧的表格头和新的tr排序好的元素连接起来,   (修改了一下)
  DataRebuildTable   =   "<table   border=1 width=100%  cellpadding=1 cellspacing=1 id='clearStart'><TBODY>"
  +   trObject[0].outerHTML   +   trRebuildHTML   +   "</TBODY>"   +      "</table>";
  clearStart.outerHTML=DataRebuildTable;//表格用新串重新写一次

  }
MyHtml.html
<head>
    <title>MyHtml.html</title>

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

       <script src="sort.js" language="javascript"></script>  </head>
<table border=1 id="clearStart">
<tr bgcolor=cccccc id='ignore'>
  <td onclick="JM_PowerList(0)">列一
  </td>
  <td onclick="JM_PowerList(1)">
   列二
  </td>
  <td onclick="JM_PowerList(2)">
   列二
  </td>
</tr>
  <tr>
  <td>
   周
  </td>
  <td>
   公务员
  </td>
  <td>
   22
  </td>
</tr>
<tr>
  <td>
   张三
  </td>
  <td>
   研究员
  </td>
  <td>
   65
  </td>
</tr>
<tr>
  <td>
   李思
  </td>
  <td>
   科学家
  </td>
  <td>
   24
  </td>
</tr>
<tr>
  <td>
  王武
  </td>
  <td>
   社会学家
  </td>
  <td>
   38
  </td>
</tr>
</table>
var rows = document.getElementById("table").rows;
var title = rows[0];
var t = title.parentNode;var arr = new Array(rows.length-1);
var i;
for(i=0; i<arr.length; ++i)
  arr[i] = rows[i+1];function compare(r1,r2){
  return Number(r2)-Number(r1);
}
arr.sort(compare);for(i=0; i<arr.length; ++i)
  t.appendChild( t.removeChild(arr[i]) );
没给出代码，不过我的想法是这样子：
初始化的时候计算机每个列的排序规则，然后给td添加自定义属性值是根据排序规则排出来的顺序，最后进行一次冒泡。
用一个全局变量做标记，单击一次，处理单击事件中计算出逆序的排序规则。。更改td的自定义属性。至于表格里的数据怎么交换这有很多种方法，你交换表格对象也行，交换表格数据也行。个人的习惯不同。。
不过我没写过如此方法可行不？还请各位指点

调试易

怎样实现javascript对table的td进行升降序排序？

解决方案 »