摘要：
inserRow（）和insertCell（）方法以表行索引的0开头。默认的insertRow（）函数相当于insertRow（-1），它在表的末尾添加一个新行。对象表。insertRow。在表objTable的末尾添加一行。InsertCell（）和insertRow（）的使用方式相同，因此我们这里不讨论它们。因为删除行时，表中的行数会发生变化，这是问题的关键。排。长度总是在减少，删除的行数总是比预期的少一半｝｝正确的JS代码：functionclearRow（）｛objTable=document.getElementById；for｛tblObj.deleteRow；｝示例：HTML代码： ；用户组管理用户组ID用户组名称操作操作JS代码：varid=4//向表函数添加行AddRow｛vartab=document.getElementById；varrow=tab.insertRow（-1）；/*添加行id*/row.id=“row”+id；varcell1=row.insertCell（-1），varcell2=row.inserdCell（-1）；varcell3=row.insereCell（-1 1）；cell1.innerHTML=“”；cell2.innerHTML=“" ; cell3.innerHTML=“”；id++；}//删除行函数deleteTheRow｛if（confirm（“您确定要删除此项吗？
inserRow()和insertCell()方法
首先，表格行索引从0开始。
insertCell()和insertRow（）的用法相同，这里就不再说了。
注意：
删除表格的行的时候，如果你删除了某一行，那么表格行数是马上就变化的
错误JS代码：
function clearRow()
{
objTable= document.getElementById("myTable");
var length = objTable.rows.length
for( var i=1; i<length ; i++ )
{
tblObj.deleteRow(i);
//应该是deleteRow(1)。因为在删除表格行的时候，表格的行数在变化，这就是问题的关键，rows.length总是在变小，删除的行数总是会比预想的要少一半
}
}
{
objTable= document.getElementById("myTable");
var length = objTable.rows.length
for( var i=1; i<length ; i++ )
{
tblObj.deleteRow(i);
//应该是deleteRow(1)。因为在删除表格行的时候，表格的行数在变化，这就是问题的关键，rows.length总是在变小，删除的行数总是会比预想的要少一半
}
}
正确JS代码：
function clearRow()
{
objTable= document.getElementById("myTable");
for( var i=1; i<objTable.rows.length ; i++ )
{
tblObj.deleteRow(1);
}
}
{
objTable= document.getElementById("myTable");
for( var i=1; i<objTable.rows.length ; i++ )
{
tblObj.deleteRow(1);
}
}
事例：
HTML代码：
<table width=100% cellpadding=0 cellspacing=0 style="font-size:13px" id="usergrouptable">
<tr style="background-image: url(../image/titlelan.gif);color:white" height=30 >
<td colspan=3> 用户组管理<span onclick="CloseDiv();" style="margin-
left:200px;20px;cursor:hand"> </span></td>
</tr>
<tr>
<td>用户组ID</td>
<td>用户组名</td>
<td>操作<input type="button" onclick="AddRow('usergrouptable');" value="+"></td>
</tr>
<tr id="row3">
<td><input type=text id='txti3' class='textStyle'> </td>
<td><input type=button id='del3' value='删除' align='absmiddle' onclick="deleteTheRow('row3');"></td>
<td>操作<input type="button" onclick="AddRow('usergrouptable');" value="+"></td>
</tr>
</table>
<tr style="background-image: url(../image/titlelan.gif);color:white" height=30 >
<td colspan=3> 用户组管理<span onclick="CloseDiv();" style="margin-
left:200px;20px;cursor:hand"> </span></td>
</tr>
<tr>
<td>用户组ID</td>
<td>用户组名</td>
<td>操作<input type="button" onclick="AddRow('usergrouptable');" value="+"></td>
</tr>
<tr id="row3">
<td><input type=text id='txti3' class='textStyle'> </td>
<td><input type=button id='del3' value='删除' align='absmiddle' onclick="deleteTheRow('row3');"></td>
<td>操作<input type="button" onclick="AddRow('usergrouptable');" value="+"></td>
</tr>
</table>
JS代码：
var id= 4;
//表格增加行
function AddRow(tablename)
{
var tab=document.getElementById(tablename);
var row=tab.insertRow(-1);
/*添加行id*/
row.id="row"+id;
var cell1=row.insertCell(-1);
var cell2=row.insertCell(-1);
var cell3=row.insertCell(-1);
cell1.innerHTML = "<input type='text' id='txti"+id+"' class='textStyle' value="+id+">";
cell2.innerHTML = "<input type=button id='del"+id+"' value='删除' align='absmiddle' onclick=\"deleteTheRow('row"+id+"');\">";
cell3.innerHTML = "<input type='button' onclick=\"AddRow('usergrouptable');\" value='+'>";
id++;
}
//删除行
function deleteTheRow(rowid)
{
if(confirm("确定删除此项吗？"))
{
var tab = document.getElementById("usergrouptable");
var row = document.getElementById(rowid);
var inx = row.rowIndex;/*获得行号rowIndex*/
//var inx = document.getElementById("del3").parentElement.parentElement.rowIndex;
tab.deleteRow(inx);/*删除此行*/
alert("删除成功！");
}
}
//表格增加行
function AddRow(tablename)
{
var tab=document.getElementById(tablename);
var row=tab.insertRow(-1);
/*添加行id*/
row.id="row"+id;
var cell1=row.insertCell(-1);
var cell2=row.insertCell(-1);
var cell3=row.insertCell(-1);
cell1.innerHTML = "<input type='text' id='txti"+id+"' class='textStyle' value="+id+">";
cell2.innerHTML = "<input type=button id='del"+id+"' value='删除' align='absmiddle' onclick=\"deleteTheRow('row"+id+"');\">";
cell3.innerHTML = "<input type='button' onclick=\"AddRow('usergrouptable');\" value='+'>";
id++;
}
//删除行
function deleteTheRow(rowid)
{
if(confirm("确定删除此项吗？"))
{
var tab = document.getElementById("usergrouptable");
var row = document.getElementById(rowid);
var inx = row.rowIndex;/*获得行号rowIndex*/
//var inx = document.getElementById("del3").parentElement.parentElement.rowIndex;
tab.deleteRow(inx);/*删除此行*/
alert("删除成功！");
}
}