html 使用JS增加表格行信息

最新推荐文章于 2019-07-08 22:54:00 发布

蓝铃铛

最新推荐文章于 2019-07-08 22:54:00 发布

阅读量651

点赞数

CC 4.0 BY-SA版权

文章标签： html button input function javascript c

本文链接：https://blog.youkuaiyun.com/hibeary/article/details/5638332

本文介绍了一种使用JavaScript实现HTML表格动态增加和删除行的方法。通过定义addItem和deleteRows两个函数，可以轻松地为表格添加新行并填充示例数据，同时提供删除已存在行的功能。

oTbody.rows[v].insertCell(5);
oTbody.rows[v].cells[5].className="bg_white";
oTbody.rows[v].cells[5].align="center";
oTbody.rows[v].cells[5].innerHTML="<input type='button' value='删除' onclick='deleteRows(this);'/>";

}
    //物料信息删除行
function deleteRows(btn)
{
var oTable = document.getElementById("whtable");
var oTbody = oTable.tBodies[0];
   var tr = btn.parentNode.parentNode;
         oTbody.deleteRow(tr.rowIndex);
}

</script>

<html>
<head>
<title>
hitest
</title>
</head>

<body>

test
</td>

<td>

test
</td>
<td>

test
</td>

</tr>
<tr>
<td>

<td>

test
</td>
<td>

test
</td>

</tr>
</table>
</body>
<input type="button" name="add" onclick="addItem() " value="add">