zoukankan      html  css  js  c++  java
  • javascript 动态添加表格 LZU

    <html>

    <head>

    <title>动态表格</title>

    <script type="text/javascript">

     

    //动态添加行

    function addRow(){

    var input1=document.createElement("input");

    input1.setAttribute("type","text");

    input1.setAttribute("onclick","addRow()");

    var td1=document.createElement("td");

    td1.appendChild(input1);

    var tr1=document.createElement("tr");

    tr1.appendChild(td1);

     

    //克隆td1  true表示td1下面所有的元素都克隆

    var td2=td1.cloneNode(true);

    tr1.appendChild(td2);

     

    var td3=td1.cloneNode(true);

    tr1.appendChild(td3);

     

    var tbody=document.getElementById("t").children[0];

    tbody.appendChild(tr1);

     

    var trs=document.getElementsByTagName("tr");

     

    if(trs.length>=2){

    for(var i=0;i<3;i++){

    //去掉倒数第二行每一个input的onclick事件

    tbody.children[trs.length-2].children[i].children[0].removeAttribute("onclick");

    }

    }

    }

    </script>

    </head>

    <body >

    <table id="t" border="1">

    <tbody>

    <tr><th>id</td><th>name</th><th>age</th></tr>

    <tr><td><input type="text" onclick="addRow()"/></td><td><input type="text" onclick="addRow()"/></td><td><input type="text" onclick="addRow()"/></td></tr>

    </tbody>

    </table>

    </body>

    </html>

  • 相关阅读:
    STL容器[26]
    SHELL[01]
    SHELL[04]
    SHELL[02]I/O重定向
    STL容器[39]
    stl.set用法总结
    STL容器[33]
    STL容器[29]
    hdu acm1071
    hdu acm 2673
  • 原文地址:https://www.cnblogs.com/lzugis/p/6539939.html
Copyright © 2011-2022 走看看