java 动态行转列_行转列的三种实现方式

上次项目中,碰到了需要将取出的数据进行行转列的操作,然后显示出来的问题,当时是吧这个问题交给了前端小姐姐,麻烦她来处理了,但是后来抽空自己研究了一下,发现其实有三种实现方式,下面直接上代码一一说明,以供参考

(一)、直接在SQL语句里面转,返回经过转换,想要的数据格式

(二)、取出原数据后,传到前端用JS转——笔者这种转的想法来自基于行列式的转置矩阵的实现原理(是不是后悔大学没好好学哈0.0)

这里方便大家看懂,多唠叨几句,这是需要进行转换的表格数据

下面是实现行转列的主要JS代码:

//点击按钮实现行列转换

$(#changeBtn).on(click, function(e) {

//先把原表格的内容存进数组set(有种简单的,吧表头的th标签全部改成td,但表头的字体会失去样式)

var set =[];

$(table tr).each(function() {var row =[];

$(this).find(th).each(function() {

row.push($(this).text());

});

$(this).find(td).each(function() {

row.push($(this).text());

});

set.push(row);

});//$("#testDiv").after("一行二列:"+set[0][1]);

//$("#testDiv").after("二行五列:"+set[1][4]);

var seted =[];//确定新数组有多少行

for(var i=0;i

seted[i]=[];

}//遍历原数组,动态添加数据(并实现行列转换)

for(var i=0;i

seted[j][i]=set[i][j];

}

}//把转换后的新数组的内容,显示出来

var reShow = "

$.each(seted,function(index, itr){

reShow+= "

";

$.each(itr,function(index, itd){

reShow+=

+itd+;

})

reShow+= "

";

})

reShow+= "

";

$("#testDiv").after(reShow);

});

下面是主要的HTML代码,有强迫症的小伙伴可以参考下:

网站年月周端口登陆人数在线时长活跃点数获取经验水晶消费充值人数

${app.webName}${app.year}${app.month}${app.week}${app.portName}${app.loginNum}${app.onlineTime}${app.activePoint}${app.addExp}${app.consume}${app.recharge}

#list>

行列转换

上次项目中,碰到了需要将取出的数据进行行转列的操作,然后显示出来的问题,当时是吧这个问题交给了前端小姐姐,麻烦她来处理了,但是后来抽空自己研究了一下,发现其实有三种实现方式,下面直接上代码一一说明,以供参考 (一)、直接在SQL语句里面转,返回经过转换,想要的数据格式 (二)、取出原数据后,传到前端用JS转——笔者这种转的想法来自基于行列式的转置矩阵的实现原理(是不是后悔大学没好好学哈0.0) 这里方便大家看懂,多唠叨几句,这是需要进行转换的表格数据 下面是实现行转列的主要JS代码: //点击按钮实现行列转换 $(#changeBtn).on(click, function(e) { //先把原表格的内容存进数组set(有种简单的,吧表头的th标签全部改成td,但表头的字体会失去样式) var set =[]; $(table tr).each(function() {var row =[]; $(this).find(th).each(function() { row.push($(this).text()); }); $(this).find(td).each(function() { row.push($(this).text()); }); set.push(row); });//$("#testDiv").after("一行二列:"+set[0][1]); //$("#testDiv").after("二行五列:"+set[1][4]); var seted =[];//确定新数组有多少行 for(var i=0;i seted[i]=[]; }//遍历原数组,动态添加数据(并实现行列转换) for(var i=0;i seted[j][i]=set[i][j]; } }//把转换后的新数组的内容,显示出来 var reShow = " $.each(seted,function(index, itr){ reShow+= ""; $.each(itr,function(index, itd){ reShow+= +itd+; }) reShow+= ""; }) reShow+= ""; $("#testDiv").after(reShow); }); 下面是主要的HTML代码,有强迫症的小伙伴可以参考下: 网站年月周端口登陆人数在线时长活跃点数获取经验水晶消费充值人数${app.webName}${app.year}${app.month}${app.week}${app.portName}${app.loginNum}${app.onlineTime}${app.activePoint}${app.addExp}${app.consume}${app.recharge} #list> 行列转换
经验分享 程序员 微信小程序 职场和发展