PHP群:95885625 Hbuilder+MUI群:81989597 站长QQ:634381967
    您现在的位置: 首页 > 开发编程 > JavaScript教程 > 正文

    如何利用JavaScript控制表格的合并

    作者:admin来源:网络浏览:时间:2020-09-30 00:07:50我要评论
    导读:表格合并有很多方法,那在jsvascrip里怎么控制表格的合并呢?分享一个方法给大家。这是测试用的表格页面的代码。复制代码 代码如下:<html>...
    表格合并有很多方法,那在jsvascrip里怎么控制表格的合并呢?分享一个方法给大家。
    这是测试用的表格页面的代码。

     
    复制代码 代码如下:
    <html>
        <head>
            <title>用JavaScript进行表格的合并</title>
        </head>
        <body>
            表格1:
            <table id="table1" border="1" width="300px" height="300px">
                <tr><td>11</td><td>12</td><td>13</td></tr>
                <tr><td>21</td><td>22</td><td>23</td></tr>
                <tr><td>31</td><td>32</td><td>33</td></tr>
            </table>
            <input type="button" value="点击"         表格2:
            <table id="table2" border="1" width="300px" height="300px">
                <tr><td>11</td><td>12</td><td>13</td></tr>
                <tr><td>21</td><td>22</td><td>23</td></tr>
                <tr><td>31</td><td>32</td><td>33</td></tr>
            </table>
            <input type="button" value="点击"     </body>
    </html>

    这是JavaScript代码。
     
    复制代码 代码如下:
    <script type="text/javascript">
            function rowspan()  // 将某行与下一行进行合并
            {
                var table = document.getElementById("table1");
                table.rows[2].deleteCell(1);
                table.rows[1].cells[1].rowSpan = 2;
                        
            }
            function colspan()  // 将某列与下一列进行合并
            {
                var table = document.getElementById("table2");
                table.rows[1].deleteCell(2);
                table.rows[1].cells[1].colSpan = 2;
            }
    </script>

    转载请注明(B5教程网)原文链接:https://b5.mxunkeji.com/content-69-667-1.html
    相关热词搜索: JavaScript 表格合并