JS自动合并表格
js合并单元格.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>JS合并表格</title><style>* {font-size:12px}table{ margin-top:5px;}.table1 {border-collapse:collapse;width:600px;border:1px solid #7A90A8;border-top:3px;}td {padding-left:3px;text-align:left;}caption{background:#9DACBF;font-weight:600;padding:4px;color:#FFF; }</style></head><body><table id="ii" border="1" align="center"><caption>2010年北京市医院分布情况</caption> <tr> <td>所在区</td> <td>二级医院数量</td> <td>三级医院数量</td> <td>三甲级医院数量</td> <td>四级医院数量</td> </tr> <tr> <td>海淀区</td> <td>8</td> <td>54</td> <td>14</td> <td>8</td> </tr> <tr> <td>海淀区</td> <td>15</td> <td>64</td> <td>36</td> <td>76</td> </tr> <tr> <td>朝阳区</td> <td>5</td> <td>64</td> <td>69</td> <td>23</td> </tr> <tr> <td>朝阳区</td> <td>17</td> <td>54</td> <td>43</td> <td>18</td> </tr> <tr> <td>朝阳区</td> <td>73</td> <td>35</td> <td>45</td> <td>72</td> </tr></table><script type="text/javascript">function tableSpan(tb1){//合并行//列for(var i=tb1.rows[0].childNodes.length-1;i>=0;i--){//行for(var j=tb1.rows.length-1;j>0;j--){//当前单元格与上一单元格比较if(tb1.rows[j].childNodes[i].innerHTML==tb1.rows[j-1].childNodes[i].innerHTML){tb1.rows[j-1].childNodes[i].rowSpan += tb1.rows[j].childNodes[i].rowSpan;tb1.rows[j].removeChild(tb1.rows[j].childNodes[i]);}}}//合并列//行for(var i=tb1.rows.length-1;i>=0;i--){ break;//不合并列//列for(var j=tb1.rows[i].childNodes.length-1;j>0;j--){//当前单元格与左一单元格比较if(tb1.rows[i].childNodes[j].innerHTML==tb1.rows[i].childNodes[j-1].innerHTML){tb1.rows[i].childNodes[j-1].colSpan += tb1.rows[i].childNodes[j].colSpan;tb1.rows[i].removeChild(tb1.rows[i].childNodes[j]);}}}}tableSpan(ii);</script></body></html>?
合并效果,将所在区相邻且字符同的都合并了