提问,为学习

Question

function addRow()
{
  var r = table1.insertRow();    // 插入一行 "<tr>"
  
  var d = r.insertCell();        // 在行上 插入一个 "td"
  var i1 = document.createElement("input");  // 建一个 input
  i1.type = "text";
  d.appendChild(i1);                         // 将 input 加到 td 上  d = r.insertCell();
  var i2 = document.createElement("input");
  i2.type = "text";
  d.appendChild(i2);
}
</script>
<input type=button name="add" value="add" onclick="addRow()">
<table id="table1" border=1 cellSpacing=0>
<tr>
<td>学号</td><td>班级</td></tr>
<tr><td><input type=text name=x></td><td><input type=text name=b></td></tr>
</table>

Answer 1

<input type=button name="add" value="add" onclick=add()>
<table id="table1" border=1 cellSpacing=0>
<tr>
<td>学号</td><td>班级</td></tr>
<tr><td><input type=text name=x></td><td><input type=text name=b></td></tr>
</table>
<script>
function add(){
table1.firstChild.appendChild(table1.firstChild.lastChild.cloneNode(true))
}
</script>

Answer 2

给出刚才的注释<input type=button name="add" value="add" onclick=add()>
<table id="table1" border=1 cellSpacing=0>
<tr>
<td>学号</td><td>班级</td></tr>
<tr><td><input type=text name=x></td><td><input type=text name=b></td></tr>
</table>
<script>
function add(){
//注意 在ie中 table的dom树是含有<TBODY>这个标签的.比如
//<table><tr><td>1</td></tr></table>
   //实际上应该是<table><tbody><tr><td>1</td></tr></tbody></table> //alert(table1.outerHTML)   //可以看到table1的dom

//这里firstChild取table的第一个子节点，返回的当然是tbody,不是tr哦
var tbody=table1.firstChild;            //这里取tbody里面最后一行tr.就是你想添加的东东啦。
        var tr=tbody.lastChild;        //alert(tr.outerHTML)  //自己看tr是什么东东 //cloneNode是复制节点(含所有属性等) 参数true指明了复制的时候同时复制其下的所有子节点
var newtr=tr.cloneNode(true)    

//添加到tbody，作为tbody的最后一个节点
tbody.appendChild(newtr)
}
</script>