有时候习惯于用Table展示数据,每个tr就是一条数据,但维度不同,有时想使用第一列做为横向维度,要是用服务端代码就比较麻烦了,可以还是一条一条的生成,生成完后在客户端逆转Table.
用户类型 | 特权A | 特权B | 特权C |
---|---|---|---|
非法用户 | 0 | 1 | 0 |
普通用户 | 10 | 9 | 1 |
VIP1 | 20 | 9 | 2 |
VIP2 | 30 | 9 | 3 |
VIP3 | 40 | 500 | 4 |
VIP4 | 50 | 500 | 5 |
VIP5 | 60 | 9999 | 6 |
VIP6 | 70 | 9999 | 7 |
VIP7 | 80 | 9999 | 8 |
VIP8 | 90 | 无限 | 9 |
VIP9 | 1000 | 无限 | 10 |
var TurnTable = function(tableid) {
this.table = document.getElementById(tableid);
}
TurnTable.prototype = {
table:null,
tbody:null,
nbody:[],
turn:function(){
this.tbody = this.table.children[0];
this.nbody = [];
this.build();
this.flush();
},
build:function(){
var columnSize=this.tbody.children.length,indexRow=this.tbody.children[0];
var th = indexRow.children,rowSize=th.length;
for(var y=0;y<rowSize;y++){
var row = document.createElement('TR');
for(var x=0;x<columnSize;x++){
var td = document.createElement(y==0?'TH':'TD');
td.innerHTML = this.tbody.children[x].children[y].innerHTML;
row.appendChild(td);
}
this.nbody.push(row);
}
},
flush:function(){
this.table.removeChild(this.tbody);
this.tbody = document.createElement('TBODY');
for(var i=0,j=this.nbody.length;i<j;i++){
this.tbody.appendChild(this.nbody[i]);
}
this.table.appendChild(this.tbody);
}
}
var tb = new TurnTable('turnTable');
tb.turn();