为什么我用innerHTML插入的元素被截取了呢？

[luaoun]

想实现的功能：点击按钮则将插入一行表格。
我用innerHTML实现的时候老是把前面的<tr><td>截取了。
代码如下：
-------------------------------------------------------
<script language = "javascript">
function add(){
var theElement = document.getElementById("upFile");
var tab="<tr><td>row2:column1</td><td>row2:column2</td></tr>";
theElement.outerHTML = tab;
alert(ggg.innerHTML);
}
</script>

<table width="75%" border="1" name="3" id="ggg">
<tr>
<td width="23%" nowrap>row1:column1</td>
<td>row1:column2</td>
</tr>
<div id="upFile" align="left"> </div>
<tr>
<td colspan="2">
<input type="button" name="Button2" value="add" onClick="add();">
</td>
</tr>
</table>
-------------------------------------------------------

[gzh_seagull]

在table中添加tr不要用innerHTML和outerHTML，不能成功的，
用createElement("tr")来实现

[yonghengdizhen]

不要用innerHTML方式进程表格操作..
应该用insertRow,insertCell方式进行..
当你的代码运行在不同的IE版本下你就会强烈的感受到这个问题的.

[luaoun]

噢噢！明白了。多谢两位提醒！
还有个问题，我用insertRow和insertCell插入表格行后，如何再做删除行列的操作，我要行列中的其他元素(例如：select,input)都删掉。如何实现，能否给段代码看看！谢了！