zoukankan      html  css  js  c++  java
  • DOM操作表格

    <!DOCTYPE html>
    <html>

    <head>
    <meta charset="UTF-8">
    <title></title>
    <script>
    function show(){
    var mtb = document.getElementById('tb');
    var mrow = document.getElementById('row').value;
    var mcel = document.getElementById('cel').value;
    var mcourse = document.getElementById('course').value;
    mtb.rows[mrow-1].cells[mcel-1].innerHTML = mcourse;
    }
    </script>
    </head>

    <body>
    <table id="tb" border="1">
    <caption>Name</caption>
    <tr>
    <td>A</td>
    <td>18</td>
    </tr>
    <tr>
    <td>B</td>
    <td>19</td>
    </tr>
    <tr>
    <td>C</td>
    <td>20</td>
    </tr>
    </table>
    <hr />

    <button value="1" onclick="alert(document.getElementById('tb').caption.innerHTML);">Caption</button><br />
    <button value="2" onclick="alert(document.getElementById('tb').rows[0].cells[0].innerHTML);">第一行第一列</button><br />
    <button value="3" onclick="alert(document.getElementById('tb').rows[1].cells[1].innerHTML);">第二行第二列</button><br />
    <button value="4" onclick="alert(document.getElementById('tb').rows[2].cells[1].innerHTML);">第三行第二列</button><br />
    <hr />

    <input type="text" id="row" size="2"/><br />
    <input type="text" id="cel" size="2"/><br />
    <input type="text" id="course" size="10"/><br />
    <button value="modify" id="btn" onclick="show()">Modify</button>
    <hr />
    </body>

    </html>

  • 相关阅读:
    单元测试大揭密
    浅析C#中 ConcurrentDictionary的实现
    C#中 ??、 ?、 ?: 、?.、?[ ]
    队列-exchange
    matlab绘制一个点
    Ubuntu install of ROS Melodic
    matlab绘制树
    matlab scatter3函数
    多个QDockWidget用程序控制自动tab切换
    基于IFC数据的施工吊装模拟
  • 原文地址:https://www.cnblogs.com/youcandomore/p/7238642.html
Copyright © 2011-2022 走看看