javascript table排序这个更简单了，不用改变现在的表格结构

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd"> 
<HTML xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>JavaScript实现可自定义排序的表格 - </TITLE> 
<META http-equiv=Content-Type content="text/html; charset=gb2312"> 
<STYLE type=text/css>BODY { 
FONT-SIZE: 0.8em; FONT-FAMILY: Trebuchet MS, Lucida Sans Unicode, Arial, sans-serif 
} 
P { 
FONT-WEIGHT: bold; MARGIN-BOTTOM: 0px 
} 
.tableWidget_headerCell { 
BORDER-RIGHT: #aca899 1px solid; BORDER-LEFT: #fff 1px solid; CURSOR: pointer; BORDER-BOTTOM: #c5c2b2 3px solid; BACKGROUND-COLOR: #ece9d8 
} 
.tableWigdet_headerCellOver { 
BORDER-RIGHT: #aca899 1px solid; BORDER-LEFT: #fff 1px solid; CURSOR: pointer; BORDER-BOTTOM: #c5c2b2 3px solid; BACKGROUND-COLOR: #ece9d8 
} 
.tableWigdet_headerCellDown { 
BORDER-RIGHT: #aca899 1px solid; BORDER-LEFT: #fff 1px solid; CURSOR: pointer; BORDER-BOTTOM: #c5c2b2 3px solid; BACKGROUND-COLOR: #ece9d8 
} 
.tableWidget_headerCell { 
BORDER-TOP: #ece9d8 2px solid 
} 
.tableWigdet_headerCellOver { 
BORDER-TOP: #ffc83c 2px solid 
} 
.tableWidget TBODY .tableWidget_dataRollOver { 
BACKGROUND-COLOR: #fff 
} 
.tableWigdet_headerCellDown { 
BORDER-RIGHT: #fff 1px solid; BORDER-TOP: #ffc83c 2px solid; BORDER-LEFT: #aca899 1px solid; BACKGROUND-COLOR: #dbd8c5 
} 
.tableWidget TD { 
PADDING-RIGHT: 2px; PADDING-LEFT: 2px; PADDING-BOTTOM: 2px; MARGIN: 0px; PADDING-TOP: 2px; BORDER-BOTTOM: #eae9e1 1px solid 
} 
.tableWidget TBODY { 
BACKGROUND-COLOR: #fff 
} 
.tableWidget { 
FONT-SIZE: 12px; WIDTH: 400px; FONT-FAMILY: arial 
} 
DIV.widget_tableDiv { 
BORDER-RIGHT: #aca899 1px solid; BORDER-TOP: #aca899 1px solid; OVERFLOW-Y: auto; BORDER-LEFT: #aca899 1px solid; WIDTH: 400px; BORDER-BOTTOM: #aca899 1px solid; HEIGHT: 200px 
} 
HTML > BODY DIV.widget_tableDiv { 
OVERFLOW: hidden; WIDTH: 400px 
} 
.tableWidget THEAD { 
POSITION: relative 
} 
.tableWidget THEAD TR { 
BOTTOM: 0px; POSITION: relative; TOP: 0px 
} 
.tableWidget .scrollingContent { 
OVERFLOW-Y: auto; WIDTH: 100% 
} 
</STYLE> 
<img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3CSCRIPT%20type%3Dtext%2Fjavascript%3E%20%0D%0A%2F*%20%0D%0A(C)%20www.dhtmlgoodies.com%2C%20October%202005%20%0D%0AThis%20is%20a%20script%20from%20www.dhtmlgoodies.com.%20You%20will%20find%20this%20and%20a%20lot%20of%20other%20scripts%20at%20our%20website.%20%0D%0ATerms%20of%20use%3A%20%0D%0AYou%20are%20free%20to%20use%20this%20script%20as%20long%20as%20the%20copyright%20message%20is%20kept%20intact.%20However%2C%20you%20may%20not%20%0D%0Aredistribute%2C%20sell%20or%20repost%20it%20without%20our%20permission.%20%0D%0AThank%20you!%20%0D%0Awww.dhtmlgoodies.com%20%0D%0AAlf%20Magne%20Kalleland%20%0D%0A*%2F%20%0D%0Avar%20tableWidget_tableCounter%20%3D%200%3B%20%0D%0Avar%20tableWidget_arraySort%20%3D%20new%20Array()%3B%20%0D%0Avar%20tableWidget_okToSort%20%3D%20true%3B%20%0D%0Avar%20activeColumn%20%3D%20new%20Array()%3B%20%0D%0Avar%20arrowImagePath%20%3D%20%22images%2F%22%3B%20%2F%2F%20Path%20to%20arrow%20images%20%0D%0Afunction%20addEndCol(obj)%20%0D%0A%7B%20%0D%0Aif(document.all)return%3B%20%0D%0Avar%20rows%20%3D%20obj.getElementsByTagName('TR')%3B%20%0D%0Afor(var%20no%3D0%3Bno%3Crows.length%3Bno%2B%2B)%7B%20%0D%0Avar%20cell%20%3D%20rows%5Bno%5D.insertCell(-1)%3B%20%0D%0Acell.innerHTML%20%3D%20'%20'%3B%20%0D%0Acell.style.width%20%3D%20'13px'%3B%20%0D%0Acell.width%20%3D%20'13'%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Afunction%20highlightTableHeader()%20%0D%0A%7B%20%0D%0Athis.className%3D'tableWigdet_headerCellOver'%3B%20%0D%0Aif(document.all)%7B%20%2F%2F%20I.E%20fix%20for%20%22jumping%22%20headings%20%0D%0Avar%20divObj%20%3D%20this.parentNode.parentNode.parentNode.parentNode%3B%20%0D%0Athis.parentNode.style.top%20%3D%20divObj.scrollTop%20%2B%20'px'%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Afunction%20deHighlightTableHeader()%20%0D%0A%7B%20%0D%0Athis.className%3D'tableWidget_headerCell'%3B%20%0D%0A%7D%20%0D%0Afunction%20mousedownTableHeader()%20%0D%0A%7B%20%0D%0Athis.className%3D'tableWigdet_headerCellDown'%3B%20%0D%0Aif(document.all)%7B%20%2F%2F%20I.E%20fix%20for%20%22jumping%22%20headings%20%0D%0Avar%20divObj%20%3D%20this.parentNode.parentNode.parentNode.parentNode%3B%20%0D%0Athis.parentNode.style.top%20%3D%20divObj.scrollTop%20%2B%20'px'%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Afunction%20sortNumeric(a%2Cb)%7B%20%0D%0Aa%20%3D%20a.replace(%2F%2C%2F%2C'.')%3B%20%0D%0Ab%20%3D%20b.replace(%2F%2C%2F%2C'.')%3B%20%0D%0Aa%20%3D%20a.replace(%2F%5B%5E%5Cd%5C-%5C.%5C%2F%5D%2Fg%2C'')%3B%20%0D%0Ab%20%3D%20b.replace(%2F%5B%5E%5Cd%5C-%5C.%5C%2F%5D%2Fg%2C'')%3B%20%0D%0Aif(a.indexOf('%2F')%3E%3D0)a%20%3D%20eval(a)%3B%20%0D%0Aif(b.indexOf('%2F')%3E%3D0)b%20%3D%20eval(b)%3B%20%0D%0Areturn%20a%2F1%20-%20b%2F1%3B%20%0D%0A%7D%20%0D%0Afunction%20sortString(a%2C%20b)%20%7B%20%0D%0Aif%20(%20a.toUpperCase()%20%3C%20b.toUpperCase()%20)%20return%20-1%3B%20%0D%0Aif%20(%20a.toUpperCase()%20%3E%20b.toUpperCase()%20)%20return%201%3B%20%0D%0Areturn%200%3B%20%0D%0A%7D%20%0D%0Afunction%20cancelTableWidgetEvent()%20%0D%0A%7B%20%0D%0Areturn%20false%3B%20%0D%0A%7D%20%0D%0Afunction%20sortTable()%20%0D%0A%7B%20%0D%0Aif(!tableWidget_okToSort)return%3B%20%0D%0AtableWidget_okToSort%20%3D%20false%3B%20%0D%0A%2F*%20Getting%20index%20of%20current%20column%20*%2F%20%0D%0Avar%20obj%20%3D%20this%3B%20%0D%0Avar%20indexThis%20%3D%200%3B%20%0D%0Awhile(obj.previousSibling)%7B%20%0D%0Aobj%20%3D%20obj.previousSibling%3B%20%0D%0Aif(obj.tagName%3D%3D'TD')indexThis%2B%2B%3B%20%0D%0A%7D%20%0D%0Avar%20images%20%3D%20this.getElementsByTagName('IMG')%3B%20%0D%0Aif(this.getAttribute('direction')%20%7C%7C%20this.direction)%7B%20%0D%0Adirection%20%3D%20this.getAttribute('direction')%3B%20%0D%0Aif(navigator.userAgent.indexOf('Opera')%3E%3D0)direction%20%3D%20this.direction%3B%20%0D%0Aif(direction%3D%3D'ascending')%7B%20%0D%0Adirection%20%3D%20'descending'%3B%20%0D%0Athis.setAttribute('direction'%2C'descending')%3B%20%0D%0Athis.direction%20%3D%20'descending'%3B%20%0D%0A%7Delse%7B%20%0D%0Adirection%20%3D%20'ascending'%3B%20%0D%0Athis.setAttribute('direction'%2C'ascending')%3B%20%0D%0Athis.direction%20%3D%20'ascending'%3B%20%0D%0A%7D%20%0D%0A%7Delse%7B%20%0D%0Adirection%20%3D%20'ascending'%3B%20%0D%0Athis.setAttribute('direction'%2C'ascending')%3B%20%0D%0Athis.direction%20%3D%20'ascending'%3B%20%0D%0A%7D%20%0D%0Aif(direction%3D%3D'descending')%7B%20%0D%0Aimages%5B0%5D.style.display%3D'inline'%3B%20%0D%0Aimages%5B0%5D.style.visibility%3D'visible'%3B%20%0D%0Aimages%5B1%5D.style.display%3D'none'%3B%20%0D%0A%7Delse%7B%20%0D%0Aimages%5B1%5D.style.display%3D'inline'%3B%20%0D%0Aimages%5B1%5D.style.visibility%3D'visible'%3B%20%0D%0Aimages%5B0%5D.style.display%3D'none'%3B%20%0D%0A%7D%20%0D%0Avar%20tableObj%20%3D%20this.parentNode.parentNode.parentNode%3B%20%0D%0Avar%20tBody%20%3D%20tableObj.getElementsByTagName('TBODY')%5B0%5D%3B%20%0D%0Avar%20widgetIndex%20%3D%20tableObj.id.replace(%2F%5B%5E%5Cd%5D%2Fg%2C'')%3B%20%0D%0Avar%20sortMethod%20%3D%20tableWidget_arraySort%5BwidgetIndex%5D%5BindexThis%5D%3B%20%2F%2F%20N%20%3D%20numeric%2C%20S%20%3D%20String%20%0D%0Aif(activeColumn%5BwidgetIndex%5D%20%26%26%20activeColumn%5BwidgetIndex%5D!%3Dthis)%7B%20%0D%0Avar%20images%20%3D%20activeColumn%5BwidgetIndex%5D.getElementsByTagName('IMG')%3B%20%0D%0Aimages%5B0%5D.style.display%3D'none'%3B%20%0D%0Aimages%5B1%5D.style.display%3D'inline'%3B%20%0D%0Aimages%5B1%5D.style.visibility%20%3D%20'hidden'%3B%20%0D%0Aif(activeColumn%5BwidgetIndex%5D)activeColumn%5BwidgetIndex%5D.removeAttribute('direction')%3B%20%0D%0A%7D%20%0D%0AactiveColumn%5BwidgetIndex%5D%20%3D%20this%3B%20%0D%0Avar%20cellArray%20%3D%20new%20Array()%3B%20%0D%0Avar%20cellObjArray%20%3D%20new%20Array()%3B%20%0D%0Afor(var%20no%3D1%3Bno%3CtableObj.rows.length%3Bno%2B%2B)%7B%20%0D%0Avar%20content%3D%20tableObj.rows%5Bno%5D.cells%5BindexThis%5D.innerHTML%2B''%3B%20%0D%0AcellArray.push(content)%3B%20%0D%0AcellObjArray.push(tableObj.rows%5Bno%5D.cells%5BindexThis%5D)%3B%20%0D%0A%7D%20%0D%0Aif(sortMethod%3D%3D'N')%7B%20%0D%0AcellArray%20%3D%20cellArray.sort(sortNumeric)%3B%20%0D%0A%7Delse%7B%20%0D%0AcellArray%20%3D%20cellArray.sort(sortString)%3B%20%0D%0A%7D%20%0D%0Aif(direction%3D%3D'descending')%7B%20%0D%0Afor(var%20no%3DcellArray.length%3Bno%3E%3D0%3Bno--)%7B%20%0D%0Afor(var%20no2%3D0%3Bno2%3CcellObjArray.length%3Bno2%2B%2B)%7B%20%0D%0Aif(cellObjArray%5Bno2%5D.innerHTML%20%3D%3D%20cellArray%5Bno%5D%20%26%26%20!cellObjArray%5Bno2%5D.getAttribute('allreadySorted'))%7B%20%0D%0AcellObjArray%5Bno2%5D.setAttribute('allreadySorted'%2C'1')%3B%20%0D%0AtBody.appendChild(cellObjArray%5Bno2%5D.parentNode)%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%7Delse%7B%20%0D%0Afor(var%20no%3D0%3Bno%3CcellArray.length%3Bno%2B%2B)%7B%20%0D%0Afor(var%20no2%3D0%3Bno2%3CcellObjArray.length%3Bno2%2B%2B)%7B%20%0D%0Aif(cellObjArray%5Bno2%5D.innerHTML%20%3D%3D%20cellArray%5Bno%5D%20%26%26%20!cellObjArray%5Bno2%5D.getAttribute('allreadySorted'))%7B%20%0D%0AcellObjArray%5Bno2%5D.setAttribute('allreadySorted'%2C'1')%3B%20%0D%0AtBody.appendChild(cellObjArray%5Bno2%5D.parentNode)%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Afor(var%20no2%3D0%3Bno2%3CcellObjArray.length%3Bno2%2B%2B)%7B%20%0D%0AcellObjArray%5Bno2%5D.removeAttribute('allreadySorted')%3B%20%0D%0A%7D%20%0D%0AtableWidget_okToSort%20%3D%20true%3B%20%0D%0A%7D%20%0D%0Afunction%20initTableWidget(objId%2Cwidth%2Cheight%2CsortArray)%20%0D%0A%7B%20%0D%0Awidth%20%3D%20width%20%2B%20''%3B%20%0D%0Aheight%20%3D%20height%20%2B%20''%3B%20%0D%0Avar%20obj%20%3D%20document.getElementById(objId)%3B%20%0D%0Aobj.parentNode.className%3D'widget_tableDiv'%3B%20%0D%0Aif(navigator.userAgent.indexOf('MSIE')%3E%3D0)%7B%20%0D%0Aobj.parentNode.style.overflowY%20%3D%20'auto'%3B%20%0D%0A%7D%20%0D%0AtableWidget_arraySort%5BtableWidget_tableCounter%5D%20%3D%20sortArray%3B%20%0D%0Aif(width.indexOf('%25')%3E%3D0)%7B%20%0D%0Aobj.style.width%20%3D%20width%3B%20%0D%0Aobj.parentNode.style.width%20%3D%20width%3B%20%0D%0A%7Delse%7B%20%0D%0Aobj.style.width%20%3D%20width%20%2B%20'px'%3B%20%0D%0Aobj.parentNode.style.width%20%3D%20width%20%2B%20'px'%3B%20%0D%0A%7D%20%0D%0Aif(height.indexOf('%25')%3E%3D0)%7B%20%0D%0A%2F%2Fobj.style.height%20%3D%20height%3B%20%0D%0Aobj.parentNode.style.height%20%3D%20height%3B%20%0D%0A%7Delse%7B%20%0D%0A%2F%2Fobj.style.height%20%3D%20height%20%2B%20'px'%3B%20%0D%0Aobj.parentNode.style.height%20%3D%20height%20%2B%20'px'%3B%20%0D%0A%7D%20%0D%0Aobj.id%20%3D%20'tableWidget'%20%2B%20tableWidget_tableCounter%3B%20%0D%0AaddEndCol(obj)%3B%20%0D%0Aobj.cellSpacing%20%3D%200%3B%20%0D%0Aobj.cellPadding%20%3D%200%3B%20%0D%0Aobj.className%3D'tableWidget'%3B%20%0D%0Avar%20tHead%20%3D%20obj.getElementsByTagName('THEAD')%5B0%5D%3B%20%0D%0Avar%20cells%20%3D%20tHead.getElementsByTagName('TD')%3B%20%0D%0Afor(var%20no%3D0%3Bno%3Ccells.length%3Bno%2B%2B)%7B%20%0D%0Acells%5Bno%5D.className%20%3D%20'tableWidget_headerCell'%3B%20%0D%0Acells%5Bno%5D.onselectstart%20%3D%20cancelTableWidgetEvent%3B%20%0D%0Aif(no%3D%3Dcells.length-1)%7B%20%0D%0Acells%5Bno%5D.style.borderRight%20%3D%20'0px'%3B%20%0D%0A%7D%20%0D%0Aif(sortArray%5Bno%5D)%7B%20%0D%0Acells%5Bno%5D.onmouseover%20%3D%20highlightTableHeader%3B%20%0D%0Acells%5Bno%5D.onmouseout%20%3D%20deHighlightTableHeader%3B%20%0D%0Acells%5Bno%5D.onmousedown%20%3D%20mousedownTableHeader%3B%20%0D%0Acells%5Bno%5D.onmouseup%20%3D%20highlightTableHeader%3B%20%0D%0Acells%5Bno%5D.onclick%20%3D%20sortTable%3B%20%0D%0Avar%20img%20%3D%20document.createElement('IMG')%3B%20%0D%0Aimg.src%20%3D%20arrowImagePath%20%2B%20'arrow_up.gif'%3B%20%0D%0Acells%5Bno%5D.appendChild(img)%3B%20%0D%0Aimg.style.visibility%20%3D%20'hidden'%3B%20%0D%0Avar%20img%20%3D%20document.createElement('IMG')%3B%20%0D%0Aimg.src%20%3D%20arrowImagePath%20%2B%20'arrow_down.gif'%3B%20%0D%0Acells%5Bno%5D.appendChild(img)%3B%20%0D%0Aimg.style.display%20%3D%20'none'%3B%20%0D%0A%7Delse%7B%20%0D%0Acells%5Bno%5D.style.cursor%20%3D%20'default'%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Avar%20tBody%20%3D%20obj.getElementsByTagName('TBODY')%5B0%5D%3B%20%0D%0Aif(document.all%20%26%26%20navigator.userAgent.indexOf('Opera')%3C0)%7B%20%0D%0AtBody.className%3D'scrollingContent'%3B%20%0D%0AtBody.style.display%3D'block'%3B%20%0D%0A%7Delse%7B%20%0D%0AtBody.className%3D'scrollingContent'%3B%20%0D%0Aif(tBody.offsetHeight%3E(tBody.parentNode.parentNode.offsetHeight%20-%2050))%20%7B%20%0D%0AtBody.style.height%20%3D%20(obj.parentNode.clientHeight-tHead.offsetHeight)%20%2B%20'px'%3B%20%0D%0A%7Delse%7B%20%0D%0AtBody.style.overflow%3D'hidden'%3B%20%0D%0A%7D%20%0D%0Aif(navigator.userAgent.indexOf('Opera')%3E%3D0)%7B%20%0D%0Aobj.parentNode.style.overflow%20%3D%20'auto'%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Afor(var%20no%3D1%3Bno%3Cobj.rows.length%3Bno%2B%2B)%7B%20%0D%0Aobj.rows%5Bno%5D.onmouseover%20%3D%20highlightDataRow%3B%20%0D%0Aobj.rows%5Bno%5D.onmouseout%20%3D%20deHighlightDataRow%3B%20%0D%0Afor(var%20no2%3D0%3Bno2%3CsortArray.length%3Bno2%2B%2B)%7B%20%2F*%20Right%20align%20numeric%20cells%20*%2F%20%0D%0Aif(sortArray%5Bno2%5D%20%26%26%20sortArray%5Bno2%5D%3D%3D'N')obj.rows%5Bno%5D.cells%5Bno2%5D.style.textAlign%3D'right'%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Afor(var%20no2%3D0%3Bno2%3CsortArray.length%3Bno2%2B%2B)%7B%20%2F*%20Right%20align%20numeric%20cells%20*%2F%20%0D%0Aif(sortArray%5Bno2%5D%20%26%26%20sortArray%5Bno2%5D%3D%3D'N')obj.rows%5B0%5D.cells%5Bno2%5D.style.textAlign%3D'right'%3B%20%0D%0A%7D%20%0D%0AtableWidget_tableCounter%2B%2B%3B%20%0D%0A%7D%20%0D%0Afunction%20highlightDataRow()%20%0D%0A%7B%20%0D%0Aif(navigator.userAgent.indexOf('Opera')%3E%3D0)return%3B%20%0D%0Athis.className%3D'tableWidget_dataRollOver'%3B%20%0D%0Aif(document.all)%7B%20%2F%2F%20I.E%20fix%20for%20%22jumping%22%20headings%20%0D%0Avar%20divObj%20%3D%20this.parentNode.parentNode.parentNode%3B%20%0D%0Avar%20tHead%20%3D%20divObj.getElementsByTagName('TR')%5B0%5D%3B%20%0D%0AtHead.style.top%20%3D%20divObj.scrollTop%20%2B%20'px'%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0Afunction%20deHighlightDataRow()%20%0D%0A%7B%20%0D%0Aif(navigator.userAgent.indexOf('Opera')%3E%3D0)return%3B%20%0D%0Athis.className%3Dnull%3B%20%0D%0Aif(document.all)%7B%20%2F%2F%20I.E%20fix%20for%20%22jumping%22%20headings%20%0D%0Avar%20divObj%20%3D%20this.parentNode.parentNode.parentNode%3B%20%0D%0Avar%20tHead%20%3D%20divObj.getElementsByTagName('TR')%5B0%5D%3B%20%0D%0AtHead.style.top%20%3D%20divObj.scrollTop%20%2B%20'px'%3B%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%3C%2FSCRIPT%3E"> 
<META content="MSHTML 6.00.5730.13" name=GENERATOR></HEAD> 
<BODY> 
<DIV class=widget_tableDiv> 
<table id=myTable> 
<THEAD> 
<TR> 
<TD>Name</TD> 
<TD>Age</TD> 
<TD>Position</TD> 
<TD>Income</TD> 
<TD>Gender</TD></TR></THEAD> 
<TBODY class=scrollingContent> 
<TR> 
<TD>John</TD> 
<TD>37</TD> 
<TD>Managing director</TD> 
<TD>90.000</TD> 
<TD>Male</TD></TR> 
<TR> 
<TD>Susan</TD> 
<TD>34</TD> 
<TD>Partner</TD> 
<TD>90.000</TD> 
<TD>Female</TD></TR> 
<TR> 
<TD>David</TD> 
<TD>29</TD> 
<TD>Head of production</TD> 
<TD>70.000</TD> 
<TD>Male</TD></TR> 
<TR> 
<TD>Laura</TD> 
<TD>29</TD> 
<TD>Head of marketing</TD> 
<TD>70.000</TD> 
<TD>Female</TD></TR> 
<TR> 
<TD>Kate</TD> 
<TD>18</TD> 
<TD>Marketing</TD> 
<TD>50.000</TD> 
<TD>Female</TD></TR> 
<TR> 
<TD>Mona</TD> 
<TD>21</TD> 
<TD>Marketing</TD> 
<TD>53.000</TD> 
<TD>Female</TD></TR> 
<TR> 
<TD>Mike</TD> 
<TD>21</TD> 
<TD>Marketing</TD> 
<TD>53.000</TD> 
<TD>Male</TD></TR> 
<TR> 
<TD>Mark</TD> 
<TD>25</TD> 
<TD>Production</TD> 
<TD>52.000</TD> 
<TD>Male</TD></TR> 
<TR> 
<TD>Peter</TD> 
<TD>33</TD> 
<TD>Production</TD> 
<TD>55.000</TD> 
<TD>Male</TD></TR> 
<TR> 
<TD>Jennifer</TD> 
<TD>24</TD> 
<TD>Production</TD> 
<TD>49.000</TD> 
<TD>Female</TD></TR> 
<TR> 
<TD>David</TD> 
<TD>25</TD> 
<TD>Photography</TD> 
<TD>51.000</TD> 
<TD>Male</TD></TR> 
<TR> 
<TD>Anna</TD> 
<TD>42</TD> 
<TD>Head of photography</TD> 
<TD>56.000</TD> 
<TD>Female</TD></TR> 
<TR> 
<TD>Rita</TD> 
<TD>30</TD> 
<TD>Photography</TD> 
<TD>54.000</TD> 
<TD>Female</TD></TR> 
<TR> 
<TD>Magnus</TD> 
<TD>25</TD> 
<TD>Freelancer</TD> 
<TD>65.000</TD> 
<TD>Male</TD></TR> 
<TR> 
<TD>Johnny</TD> 
<TD>29</TD> 
<TD>Freelancer</TD> 
<TD>63.000</TD> 
<TD>Male</TD></TR></TBODY></TABLE></DIV> 
<img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3CSCRIPT%20type%3Dtext%2Fjavascript%3E%20%0D%0AinitTableWidget('myTable'%2C500%2C250%2CArray('S'%2C'N'%2Cfalse%2C'N'%2C'S'))%3B%20%0D%0A%3C%2FSCRIPT%3E">

</BODY></HTML>

　　 [Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

教程首页更多教程

javascript table排序 这个更简单了，不用改变现在的表格结构

javascript table排序这个更简单了，不用改变现在的表格结构