Html表使用javascript动态添加和删除行[关闭]
Posted
技术标签:
【中文标题】Html表使用javascript动态添加和删除行[关闭]【英文标题】：Html table add and delete rows dynamically with javascript [closed] 【发布时间】：2021-08-28 18:52:22 【问题描述】：我希望有一个最初没有行的表，然后动态创建每一行并能够删除每一行。 我得到无法读取未定义的属性“childNodes” 请告诉我应该怎么做， 谢谢。
function addRow()
var table = document.getElementById("myTable");
var row = table.insertRow(0);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
cell1.innerhtml = "NEW CELL1";
cell2.innerHTML = "NEW CELL2";
function deleteRow(tableID)
try
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
for (var i = 0; i < rowCount; i++)
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
table.deleteRow(i);
rowCount--;
i--;
catch (e)
alert(e);
<!DOCTYPE html>
<html>
<head>
<style>
table,
td
border: 1px solid black;
</style>
</head>
<body>
<p>Click the button to add a new row at the first position of the table and then add cells and content.</p>
<table id="myTable">
<TR>
</TR>
</table>
<br>
<button type="button" onclick="addRow()">Add</button>
<button type="button" onclick="deleteRow('myTable')">Delete</button>
</body>
</html>【问题讨论】：
该表名为myTable，而不是tableData。
@Barmar 说了什么，然后编辑这一行：table.deleteRow(row);
【参考方案1】：
<button type="button" onclick="deleteRow('myTable')">Delete</button>
只是传入了错误的表 ID。
【讨论】：
TypeError: 无法读取具有正确表 ID 的未定义属性“childNodes”。 @Cameron121341 听起来像是另一个问题的不同问题以上是关于Html表使用javascript动态添加和删除行[关闭]的主要内容，如果未能解决你的问题，请参考以下文章
javascript [删除样式表]使用jQuery删除动态添加的样式表#javascript #sitewrench
使用 Javascript 在动态添加删除行中计算行值和列值