Maison >développement back-end >tutoriel php >php使用js对表格进行排序
<meta http-equiv="Content-type" c charset="utf-8"> <title> <span>sort</span> table</title> <style> *<span>{ margin:<span>0px; padding:<span>0px; } body{ background:<span>#<span>ccc;<span> } table{ width:<span>350px; margin:0<span> auto; background-color:<span>#<span>eee;<span> } table th{ cursor:<span>hand; padding:5px 0<span>; background-color:<span>#<span>999;<span> } table td{ background-color:<span>#<span>fff; font-size:<span>16px; font-weight:<span>normal; text-align:<span>center; line-height:<span>30px; } </style> <script language="javascript"> <span>function<span> sortCells(type){ <span>var tbs=document.getElementsByTagName("table")[0<span>]; <span>var arr=<span>[]; <span>var arr2=<span>[]; <span>for(<span>var i=1;i<tbs.rows.length;i++<span>){ <span>var text=tbs.rows[i].cells[type].<span>innerText; arr.<span>push(text); arr2[text]=<span>i; } <span>if(type==0<span>){ arr.<span>sort(<span>function(a,b){<span>return a-<span>b}); }<span>else<span>{ arr.<span>sort<span>(); } <span>var temp=""<span>; <span>for(<span>var j=1;j<tbs.rows.length;j++<span>){ temp=tbs.rows[j].cells[0].<span>innerText; tbs.rows[j].cells[0].innerText=tbs.rows[arr2[arr[j-1]]].cells[0].<span>innerText; tbs.rows[arr2[arr[j-1]]].cells[0].innerText=<span>temp; temp=tbs.rows[j].cells[1].<span>innerText; tbs.rows[j].cells[1].innerText=tbs.rows[arr2[arr[j-1]]].cells[1].<span>innerText; tbs.rows[arr2[arr[j-1]]].cells[1].innerText=<span>temp; temp=tbs.rows[j].cells[2].<span>innerText; tbs.rows[j].cells[2].innerText=tbs.rows[arr2[arr[j-1]]].cells[2].<span>innerText; tbs.rows[arr2[arr[j-1]]].cells[2].innerText=<span>temp; <span>//<span> console.log(arr2);<span>for(<span>var i=1;i<tbs.rows.length;i++<span>){ <span>var text=tbs.rows[i].cells[type].<span>innerText; arr2[text]=<span>i; } } } </script> <center> <span>sort</span> table</center>