题目:
给定一个table,编写一个js函数,输入table的列名和desc(降序)或者asc(升序),对该列的数据重新排序。
html代码:
<!DOCTYPE html>
<html>
<head>
<title>数组排序</title>
</head>
<body>
<table id="table1" border="1">
<tr>
<th>Id</th>
<th>Grade</th>
<th>Age</th>
</tr>
<tr><td>1</td><td>123</td><td>2</td></tr>
<tr><td>2</td><td>13</td><td>5</td></tr>
<tr><td>5</td><td>23</td><td>19</td></tr>
<tr><td>3</td><td>12</td><td>3</td></tr>
<tr><td>4</td><td>3</td><td>4</td></tr>
</table>
<input type="text" id="typeinput" value="Id">
<input type="text" id="sortinput" value="desc">
<button onclick="sort_t(typeinput.value,sortinput.value)">点击</button>
</body>
...js代码
</html>
js部分:
<script type="text/javascript">
//题目要求是写函数,为了效果,这里是获取的input值。
function sort_t(tyi,sort2){
console.log(tyi);
if(tyi=='Id'){
ty=0;
}else if(tyi=='Grade'){
ty=1;
}else{
ty=2;
}
var sort1 = sort2.toLowerCase();
//返回所有tr标签的对象数组
var trs = document.getElementsByTagName('tr');
var a = new Array(trs.length-1);
for(var i=1;i<trs.length;i++){
//选择第i条tr的第ty列的值
var inn = trs[i].childNodes[ty].innerHTML;
a[i-1]= parseInt(inn);
console.log(a[i-1]);
}
// 升序
if(sort1=='asc'){
console.log('asc');
var max=0;
for(var i=0;i<a.length;i++){
for(var j=0;j<a.length-i-1;j++){
if(a[j]>a[j+1]){
max=a[j];
a[j] = a[j+1];
a[j+1] =max;
}
}
}
}
//降序
if(sort1=='desc'){
console.log('desc'+a.length);
var min=0;
for(var i=0;i<a.length-1;i++){
for(var j=0;j<a.length-1-i;j++){
if(a[j] < a[j+1]){
min=a[j];
a[j] = a[j+1];
a[j+1] =min;
}
}
}
}
for(var i=1;i<trs.length;i++){
console.log(a[i-1]);
trs[i].childNodes[ty].innerHTML = a[i-1];//赋值
}
}
</script>
结果:
注意几点:
1、var inn = trs[i].childNodes[ty].innerHTML; 这句返回的是字符串,一定要parseInt(inn)转成数值。