利用JavaScript控制表格的合并

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

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

<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代码。

利用JavaScript控制表格的合并

时间: 2024-09-30 16:15:39

利用JavaScript控制表格的合并的相关文章

利用JavaScript如何创建一个table表格[第2种方法]

创建一个五行五列的表格(使用循环) <style> td{border:1px solid #ccc;} </style> <script> window.onload=function(){ var oTable=document.createElement("table"); var row; var cell; for(var i=0;i<5;i++){ row=document.createElement("tr")

利用JavaScript如何创建一个table表格

创建Table标签和定义表格头部份代码: window.onload=function(){ var arr=["编号","性别","姓名","年龄"]; var oDatas=[ { "id":1 , "gender":"男", "name" : "Javascript" , "age":30 }, { &

利用JavaScript通过单选框radio控制div的显示和隐藏

通过鼠标单击单选框的动作,实现某个div或多个div的显示和隐藏.实例如下: JavaScript代码如下: 1 function divClick(){ 2 3 var show = ""; 4 show = $("input[name='AdPrintMode']:checked").val(); 5 switch (show){ 6 case '1': 7 document.getElementById("img1").style.disp

利用JavaScript所见即所得的生成Excel表格

笔者认为,解决问题的途径n种,也有很多组合的使用.我们用Excel导出大量数据的时候,可能会从服务器端,但如果数据量较小,是不是也可以考虑使用JavaScript就可以轻量级的导出呢.另外实际工作中,用户也会考虑,所见即所得的导出当前见到的内容到Excel表格中.这里,笔者有那么一丢丢感想,像文档数据.文件数据.图片数据归根结底都是一些数据码,而数据码的解析方式也是分多钟的,像.html的文件可以用记事本.浏览器.编辑工具等打开.这里笔者就利用Excel能够打开html文档,投机取巧了一把后缀名

利用JavaScript实现动态显示表格且对应改变按键的value值

插入的代码并没有符合HTML5样式,只是为了实现利用JS动态显示表格,并且按键的value值会同时发生变化的功能. 1 <!DOCTYPE > 2 <html > 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 </head> 6 <body> 7 <table width

javascript生成表格增删改查 JavaScript动态改变表格单元格内容 动态生成表格 JS获取表格任意单元格 javascript如何动态删除表格某一行

jsp页面表格布局Html代码 <body > <center> <input type="text" value="111" id="mytext"> <table border="1" width="60%" id="mytable"> <tr> <td id="td1">第一行第一列<

10.1 控制表格

表格是网页上最常见的元素.在传统的网页设计中表格除了显示数据外,还常常被用采作为整个页面布局的手段.在Web标准逐渐深入设计领域以后,表格逐渐不再承担布局的任务,但是表格仍然都在网页设计中发挥着重要的作用. 本章继续挖掘 CSS的强大功能,让普普通通的表格也表现出精彩的一面. 表格作为传统的HTML元素,一直受到网页设计者们的青睬.使用表格米表示数据.制作词查表等应用在网络中屡见不鲜.同时因为表格框架的简单.明了,使用没有边框的表格来排版,也受到很多设计者的喜爱.本节主要介绍CSS控制表格的方法

利用javascript和WebGL绘制地球 【翻译】

利用javascript和WebGL绘制地球 [翻译] 原翻译:利用javascript和WebGL绘制地球 [翻译] 在我们所有已知的HTML5API中,WebGL可能是最有意思的一个,利用这个API我们能够在浏览器中创造出炫酷3D场景的能力.本文将完整的向你展示一些炫酷是如何实现的. 需要特别指出的是,这篇教程我们将会构建一个地球行星模型,这个模型可以像一个兴奋的人一样环绕的旋转,另外,它可能使我们可以获得一些其他程序员的称赞,好吧,就这么多了. 准备 这篇教程我们将会用到一个令人着迷的We

如何使用JavaScript控制CSS Animations(动画)和Transitions(过渡)

Zach邮件跟我说,上Stack Overflow这类的论坛,他经常碰到一些关于JavaScript控制CSS 动画的问题,又提供给我几个例子.我很久就打算写一些关于这方面的文章,所以很高兴让Zach提出来并促使我写了这个教程. 有时候WEB开发人员认为CSS的动画比JavaScript的动画更难理解.虽然CSS动画有其局限性,但它的性能比大多数JavaScript库更加高效,因为它可以借助硬件加速啊!其效果绝对可以超出我们的预期. CSS animations和transitions再加上点J