JS动态添加删除表格数据
Posted 动起来mygod
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JS动态添加删除表格数据相关的知识，希望对你有一定的参考价值。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JSDom获取图层节点</title>
</head>
<body>
<script type="text/javascript">
function change() {
var stuName=document.getElementById("stuName").value;
var stuTable=document.getElementById("stuTable");
var index=stuTable.rows.length;
var tableRowObj=stuTable.insertRow(index);
var trId="table"+index;
tableRowObj.id=trId;
var tableCell0=tableRowObj.insertCell(0);
var tableCell1=tableRowObj.insertCell(1);
tableCell0.innerHTML=stuName;
tableCell1.innerHTML=\'<input type="button" value="删除" onclick="del(\\\'\'+trId+\'\\\')">\';
}
function del(trId) {
var tableObject=document.getElementById("stuTable");
var tableRowObject=document.getElementById(trId);
tableObject.deleteRow(tableRowObject.rowIndex);
}
</script>
<input type="text" id="stuName">
<input type="button" value="添加" onclick="change()">
<table border="3px" id="stuTable">
<tr>
<th>姓名</th>
<th>操作</th>
</tr>
</table>
</body>
</html>
以上是关于JS动态添加删除表格数据的主要内容，如果未能解决你的问题，请参考以下文章