js实现对table的增加行和删除行的操作方法

前端之家收集整理的这篇文章主要介绍了js实现对table的增加行和删除行的操作方法前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

如下所示:

无<a href="https://www.jb51.cc/tag/biaoti/" target="_blank" class="keywords">标题</a>文档

<script type="text/javascript">
//删除其中一行
function deltr(trid)
{ //alert(trid);
var tab=document.getElementByIdx_x("signFrame");
var row=document.getElementByIdx_x(trid);
var index=row.rowIndex;//rowIndex属性为tr的索引值,从0开始
tab.deleteRow(index); //从table中删除

//重新排列序号,如果没有序号,这一步省略
var nextid;
for(i=index;i<tab.rows.length;i++){
tab.rows[i].cells[0].innerHTML = i.toString();
nextid=i+1;
remark=document.getElementByIdx_x("remark"+nextid);
remark.id="remark";
}
}

<script type="text/javascript">
function showid(txt)
{alert(txt.id);
}

<table border="1px" width="70%" id="signFrame">
<tr id="trHeader">
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr id="trHeader">
<td width="50px">序号</td>
<td width="170px">时间</td>
<td width="100px">方式</td>
<td>备注</td>
<td width="80px">操作</td>
</tr>
<tr id="trHeader">
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr id="trHeader">
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr id="trHeader">
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr id="trHeader">
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>

以上就是小编为大家带来的js实现对table的增加行和删除行的操作方法全部内容了,希望大家多多支持编程之家~

原文链接:https://www.f2er.com/js/45201.html

猜你在找的JavaScript相关文章