javascript合并HTML单元格

最新推荐文章于 2021-09-10 16:26:58 发布

风一样的执着

最新推荐文章于 2021-09-10 16:26:58 发布

阅读量1k

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/alan294902466/article/details/16943873

版权

JavaScript 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<html>  

  <head>  

  <meta http-equiv="Content-Type" content="text/html; charset=gb2312">  

  <title>合并表格</title>  

  <script>  

  ///  

  //功能：合并表格  

  //参数：tb－需要合并的表格ID  

  //参数：colLength－－需要对前几列进行合并，比如，  

  //想合并前两列，后面的数据列忽略合并，colLength应为2  

  //缺省表示对全部列合并      

  ///  

  function uniteTable(tb,colLength){  

  //检查表格是否规整  

  if(!checkTable(tb)) return;  

    var i=0;  

    var j=0;  

    var rowCount=tb.rows.length; //行数  

    var colCount=tb.rows[0].cells.length; //列数  

    var obj1=null;  

    var obj2=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) return;  

      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());  

        }  

      }  

    }  

  }  

   

  /  

  //功能：检查表格是否规整  

  //参数：tb－－需要检查的表格ID  

  //data: 2011.11.06    

  /  

  function checkTable(tb){  

    if(tb.rows.length==0) return false;  

    if(tb.rows[0].cells.length==0) return false;  

    for(var i=0;i<tb.rows.length;i++){  

      if(tb.rows[0].cells.length!=tb.rows[i].cells.length) return false;  

    }  

    return true;  

  }  

  </script>  

  </head>   

  <body>  

  <table width="400" border="1" id="table1">  

      <tr>  

          <td>a</td>  

          <td>for</td>  

          <td>100</td>  

          <td>200</td>

          <td>1</td>    

      </tr>  

      <tr>  

          <td>a</td>  

          <td>for</td>  

          <td>100</td>  

          <td>300</td> 

          <td>2</td>   

      </tr>  

      <tr>  

          <td>a</td>   www.2cto.com

          <td>if</td>  

          <td>100</td>  

          <td>200</td> 

          <td>3</td> 

      </tr>  

      <tr>  

          <td>a</td>  

          <td>if</td>  

          <td>300</td>  

          <td>230</td> 

          <td>4</td> 

      </tr>  

      <tr>  

          <td>a</td>  

          <td>if</td>  

          <td>320</td>  

          <td>230</td>

          <td>5</td>  

      </tr>  

  </table>  

  <br><input type="button" value="合并表格" onClick="uniteTable(table1,4)">  

  </body>  

  </html>

风一样的执着

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
javascript合并HTML单元格

合并表格 /////////////////////////////////////////////// //功能：合并表格 //参数：tb－需要合并的表格ID //参数：colLength－－需要对前几列进行合并，比如， //想合并前两列，后面的数据列忽略合并，colLength应为2 //缺省表
复制链接

扫一扫