首页 > 代码库 > 利用JavaScript控制表格的合并

利用JavaScript控制表格的合并

2024-07-04 04:37:57   225人阅读

<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="http://www.mamicode.com/点击"         表格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="http://www.mamicode.com/点击"     </body>
</html>


这是测试用的表格页面的代码。


<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>

这是JavaScript代码。

本文出自 “sr5220” 博客，请务必保留此出处http://sr5220.blog.51cto.com/5282574/1409410


联系
我们