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>javaScrip基于对象</title><style type="text/css"><!--.theadCss {color: #FFF;background-color: #000;}--></style><script language="javascript" src="js/jquery-1.4.1.js" type="text/javascript"></script><script language="javascript" type="text/javascript">$(document).ready(function(){//添加根据不同的列排序$("thead > tr >td").eq(0).click(function(){sortTable(0);});$("thead > tr >td").eq(1).click(function(){sortTable(1);});$("thead > tr >td").eq(2).click(function(){sortTable(2);});});function sortTable(indexs){//通过.get() 获取DOM元素(把jQuery 元素转换为DOM 元素) var rows = $("tbody>tr").get();//sort 排序rows = rows.sort(function(a,b){//排序不区分大小写var keyA = $(a).find("td").eq(indexs).text().toUpperCase();var keyB = $(b).find("td").eq(indexs).text().toUpperCase();if(keyA < keyB){return -1;}if(keyA > keyB){return 1;}return 0;});//全部重新从尾部插入,这里因为已存在就移动到尾部$.each(rows,function(index,row){$("table>tbody").append(row);});}</script></head><body><table ><!-- 这里用thead,tbody 是为了方便 使用选择器 --> <thead class="theadCss"> <tr> <td>标号</td> <td>名称</td> <td>备注</td> </tr> </thead> <tbody> <tr> <td>4</td> <td>doc</td> <td>word</td> </tr> <tr> <td>2</td> <td>window</td> <td>MicroSoft</td> </tr> <tr> <td>3</td> <td>kingsoft</td> <td>wps</td> </tr> <tr> <td>1</td> <td>google</td> <td>great</td> </tr> <tr> <td>5</td> <td>baidu</td> <td>sb</td> </tr> </tbody></table></body></html>?