最近遇到需求，动态生成表格，类似Excel，支持合并单元格的表格，代码分享给大家~
一、网上找到的简单生成表格的例子：
以下是生成规则表格m行*n列类似，可以直接打开HTML查看结果。
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>动态生成表格</title><script type="text/javascript"></script></head><body>行:<input type="text" id="h"/> 列:<input type="text" id="l"/><br/><input type="button" value="生成" onclick="addTable();"/><div id="div1"></div><script type="text/javascript">function addTable() {var row1=document.getElementById("h").value;//获取属性值var col1=document.getElementById("l").value;//获取属性值var div1=document.getElementById("div1");var tab="<table border='1' bordercolor='blue' width='200' height='10'>";//循环行for(var i=1;i<=row1;i++){tab+="<tr>";//循环列for(var j=1;j<=col1;j++){tab+="<td>单元格j</td>";}tab+="</tr>";}tab+="</table>"div1.innerHTML=tab;}</script></body></html>
二、生成合并单元格样式的表格，项目中遇到的，我是通过后台接口拼出json串来展现表格的，下面只显示页面的东东，后台暂时忽略：
//appendStr为表格HTML字符串，"rowspan": 1, "colspan": 1为合并单元格的参数var appendStr ='<div class="dashedDiv" id=' + block.id + ' showorder='+block.showOrder+' style="width:100%;">'+ '<div class="row clearfix">'+ '<div class="col-md-8 column">'+ '<table class="columnTable table table-bordered">';//json为js定义的一个json对象var json = [{"rowindex": 0,"collist": [{"row_index": 0, "col_index": 0, "rowspan": 1, "colspan": 1,"correlation_value":"dfd"}, {"row_index": 0,"col_index": 1,"rowspan": 1,"colspan": 1, "correlation_value":"dfd"}, {"row_index": 0, "col_index": 2, "rowspan": 1, "colspan": 1,"correlation_value":"dfd"}]},{"rowindex": 1,"collist": [{"row_index": 1, "col_index": 0, "rowspan": 2, "colspan": 1,"correlation_value":"dfd"}, {"row_index": 1,"col_index": 1,"rowspan": 1,"colspan": 1,"correlation_value":"dfd"}, {"row_index": 1, "col_index": 2, "rowspan": 1, "colspan": 1,"correlation_value":"dfd"}]},{"rowindex": 2,"collist": [{"row_index": 2, "col_index": 1, "rowspan": 1, "colspan": 1,"correlation_value":"dfd"}, {"row_index": 2,"col_index": 2,"rowspan": 1,"colspan": 1,"correlation_value":"dfd"}]}];for (var i = 0; i < json.length; i++) {appendStr += "<tr>";//循环列for (var j = 0; j < json[i].colList.length; j++) {appendStr += "<td rowspan='" + json[i].colList[j].rowspan + "'>" + json[i].colList[j].correlationValue+ "</td>";}appendStr += "</tr>";}appendStr += '</table>'+ '</div>'+ '<div class="col-md-4 column">'+ '</div>'+ ' </div>'+ '</div>';//div_content为页面div，存放table用$("#div_content").append(appendStr);
效果图如下：
—-第一次发博，大家可以多多沟通交流，提出宝贵意见哈~~~~~
