js必须等表格加载完成后调用。
效果如图：
js代码：
function uniteTable(tableId,colLength) { //colLength-- 需要合并单元格的列1开始 var tb=document.getElementById(tableId); tb.style.display=''; var i = 0; var j = 0; var rowCount = tb.rows.length; // 行数 var colCount = tb.rows[0].cells.length; // 列数 var obj1 = null; var obj2 = null; var obj3 = null; //为每个单元格命名 for (i = 0; i < rowCount; i++) { for (j = 0; j < colCount; j++) { tb.rows[i].cells[j].id = "tb__" + i.toString() + "_" + j.toString(); } } //合并行 for (i = 0; i < colCount; i++) { if (i == colLength) break; obj1 = document.getElementById("tb__0_" + i.toString()) for (j = 1; j < rowCount; j++) { obj2 = document.getElementById("tb__" + j.toString() + "_" + i.toString()); if (obj1.innerText == obj2.innerText) { obj1.rowSpan++; obj2.parentNode.removeChild(obj2); } else { obj1 = document.getElementById("tb__" + j.toString() + "_" + i.toString()); } } } //合并列 for (i = 0; i < rowCount; i++) { colCount = tb.rows[i].cells.length; obj1 = document.getElementById(tb.rows[i].cells[0].id); for (j = 1; j < colCount; j++) { if (j >= colLength) break; if (obj1.colSpan >= colLength) break; obj2 = document.getElementById(tb.rows[i].cells[j].id); if (obj1.innerText == obj2.innerText) { obj1.colSpan++; obj2.parentNode.removeChild(obj2); j = j - 1; } else { obj1 = obj2; j = j + obj1.rowSpan; } } } }
优化后的效果（这里只实现了合并行）：
效果图如下：
代码如下：
function uniteTable(tableId,colLength) { //colLength-- 需要合并单元格的列1开始 var tb=document.getElementById(tableId); tb.style.display=''; var i = 0; var j = 0; var rowCount = tb.rows.length; // 行数 var colCount = tb.rows[0].cells.length; // 列数 var obj1 = null; var obj2 = null; var obj3 = null; //为每个单元格命名 for (i = 0; i < rowCount; i++) { for (j = 0; j < colCount; j++) { tb.rows[i].cells[j].id = "tb__" + i.toString() + "_" + j.toString(); } } //合并行 （列循环）第一行第一列均从0开始 for (i = 0; i < colCount; i++) { //如果第3，4，5列不进行合并操作 if (i == 2 || i == 3 || i == 4) continue; obj1 = document.getElementById("tb__0_" + i.toString()) //（行循环） for (j = 1; j < rowCount; j++) { obj2 = document.getElementById("tb__" + j.toString() + "_" + i.toString()); if(i == 0){ //第1列全部进行合并操作 if (obj1.innerText == obj2.innerText) { //判断值是否相等 obj1.rowSpan++; //合并行 obj2.parentNode.removeChild(obj2); //移除被合并的行 } else { obj1 = document.getElementById("tb__" + j.toString() + "_" + i.toString()); } }else if(i == 5){ //第6列合并操作参照第2列，第二列合并了，第5列才进行合并 obj3 = document.getElementById("tb__" + j.toString() + "_" + (i-4).toString()); if (obj1.innerText == obj2.innerText && obj3 == null) { obj1.rowSpan++; obj2.parentNode.removeChild(obj2); } else { obj1 = document.getElementById("tb__" + j.toString() + "_" + i.toString()); } }else{ //只有前一列进行了合并操作后面的才会进行合并操作 obj3 = document.getElementById("tb__" + j.toString() + "_" + (i-1).toString()); if (obj1.innerText == obj2.innerText && obj3 == null) { obj1.rowSpan++; obj2.parentNode.removeChild(obj2); } else { obj1 = document.getElementById("tb__" + j.toString() + "_" + i.toString()); } } } } }
