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

查看全文

相关阅读:
python3--字符串
 python3--数字运算，取数
 全栈项目|小书架|服务器开发-用户模块设计（用户表设计，注册登录，退出登录）
全栈项目|小书架|服务器开发-NodeJS 使用 JWT 实现登录认证
 全栈项目|小书架|服务器开发-JWT 详解
 全栈项目|小书架|服务器开发-Koa2中间件机制洋葱模型了解一下
 全栈项目|小书架|服务器开发-NodeJS 中使用 Sequelize 操作 MySQL数据库
 全栈项目|小书架|服务器开发-Koa2 连接MySQL数据库(Navicat+XAMPP)
全栈项目|小书架|服务器开发-Koa2 参数校验处理
 全栈项目|小书架|服务器开发-Koa2 全局异常处理

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