点击按钮在表格的某一行下,在添加一行(HTML+JS)

时间:2024-02-23 07:27:56

使用js在指定的tr下添加一个新的一行newTr

html代码:

<table>

  <tr>

    <td>用户名:</td>

    <td><input type="text" name="username"></td>

  </tr>

  <tr>

    <td>密码:</td>

    <td><input type="text" name="password"></td>

  </tr>

  <tr>

    <td colspan=2>

      <input type="button" name="add" value="在密码行后添加一行" onclick="addTr()">

    </td>

  </tr>

</table>

 

javascript代码:

<script>

  function addTr(){

    var tb=document.getElementById("table1");

    var newTr=tb.insertRow(2);//表示在第二行后添加一行

    var newTd=newTr.insertCell();//表示在添加的行上添加第一格

    newTd.innerHTML="邮箱:";

    var newTd2=newTr.insertCell();//表示在添加的行上添加第二格

    newTd.innerHTML="<input type=\'text\' name=\'email\' />";

  }

</script>