zoukankan html css js c++ java

表格代码

<table width="100%" border="1" cellspacing="0" cellpadding="0" id="tab">
<thead>
<tr>
<th>姓名 </th>
<th>性别 </th>
<th>年龄</th>
<th>科目</th>
<th>分数</th>
</tr>
</thead>
<tbody>
<tr>
<td>张三 </td>
<td>男 </td>
<td>22 </td>
<td>数学 </td>
<td>90 </td>
</tr>
<tr>
<td>张三 </td>
<td>男 </td>
<td>22 </td>
<td>数学 </td>
<td>90 </td>
</tr>
<tr>
<td>张三 </td>
<td>女 </td>
<td>22 </td>
<td>语文 </td>
<td>70 </td>
</tr>
<tr>
<td>张三 </td>
<td>女 </td>
<td>22 </td>
<td>英语 </td>
<td>60 </td>
</tr>
<tr>
<td>李四 </td>
<td>女 </td>
<td>22 </td>
<td>数学 </td>
<td>60 </td>
</tr>
<tr>
<td>李四 </td>
<td>女 </td>
<td>19 </td>
<td>语文 </td>
<td>60 </td>
</tr>
<tr>
<td>王五 </td>
<td>男 </td>
<td>19 </td>
<td>英语 </td>
<td>60 </td>
</tr>
<tr>
<td>王五 </td>
<td>男 </td>
<td>19 </td>
<td>英语 </td>
<td>60 </td>
</tr>
<tr>
<td>王五 </td>
<td>男 </td>
<td>19 </td>
<td>英语 </td>
<td>60 </td>
</tr>
</tbody>
</table>
  <script>
                window.onload=function(){
tablecols("tab",4);
                }
function tablecols(id,endrows) {
var trs = document.getElementById('tab').getElementsByTagName('tbody')[0].rows;
var count = 1;
var count2 = 1;
var beginrows = 0;
for (var j = 0; j < endrows; j++) {
if(j==0) {
for (var i = 0; i < trs.length; i++) {
if (i == 0) {
var tds = trs[0].cells[j].innerHTML;
continue;
}
if (trs[i].cells[j].innerHTML == tds) {
++count;
if (i == trs.length - 1) {
if (count >= 2) {
var b = i + 1;
dealwith(trs, b, count, j);
count = 1;
}
}
} else {
if (count >= 2) {
dealwith(trs, i, count, j);
count = 1;
}
tds = trs[i].cells[j].innerHTML;
}
}}else {
for (var n = 0; n < trs.length;) {
var rowspan = trs[n].cells[j - 1].getAttribute('rowspan');
if (n == 0) {
var tds = trs[0].cells[j].innerHTML;
}
if (rowspan) {
for (var m = 0; m < rowspan; m++) {
if (trs[n].cells[j].innerHTML == tds) {
++count2;
if(n==0){--count2}
if (n == trs.length - 1) {
if (count2 >= 2) {
var b = n + 1;
dealwith(trs, b, count2, j);
count2 = 1;
}
}
} else {
if (count2 >= 2) {
dealwith(trs, n, count2, j);
count2 = 1;
}
tds = trs[n].cells[j].innerHTML;
}
n++;
}
rowspan = null;
tds=null;
}else{
++n
}
}
}
}
}
function dealwith(trs,i,count,j){
for (var k = i-1; k > i - count; k--) {
trs[k].cells[j].style.display = "none";
}
trs[i - count].cells[j].rowSpan = count;
}
</script>

姓名	性别	年龄	科目	分数
张三	男	22	数学	90
张三	男	22	数学	90
张三	女	22	语文	70
张三	女	22	英语	60
李四	女	22	数学	60
李四	女	19	语文	60
王五	男	19	英语	60
王五	男	19	英语	60
王五	男	19	英语	60

查看全文

相关阅读:
5月7日 python学习总结 MySQL数据库（一）
5月4日 python学习总结 socketserver
5月2日 python学习总结 IO模型
 4月28日 python学习总结线程与协程
 4月27日 python学习总结 GIL、进程池、线程池、同步、异步、阻塞、非阻塞
 4月26日 python学习总结 JoinableQueue、线程、三种锁
 4月25日 python学习总结互斥锁 IPC通信和生产者消费者模型
 4月24日 python学习总结多进程与子进程
 DataNode数据处理中心DataXceiver
DataNode数据处理中心DataXceiver

原文地址：https://www.cnblogs.com/heyinwangchuan/p/6158358.html