Javascript 将行添加到现有表中

我可以知道如何将项目插入我的表体吗？我的代码似乎不起作用

var tableRef=document.getElementById（“myList”）.getElementsByTagName（“tbody”）；
var newRow=tableRef.insertRow（tableRef.rows.length）；
var newCell=tableRef.insertCell（0）；
var mytextwo=“你好世界”；
var newText=document.createTextNode（myTextTwo）；
appendChild（newText）；

产品ID
品名
量

要使其正常工作，您需要：

1）将

[0]

放在

.getElementsByTagName（）

之后，如下所示，因为此方法返回一个元素数组，而

.getElementById（）

返回第一个实例：

var tableRef = document.getElementById("myList").getElementsByTagName("tbody")[0];

2）在您希望单元格所在的行中使用

.insertCell（）

，在本例中是

newRow

，而不是在表的

tbody

：

var newCell = newRow.insertCell(0);

正确的JavaScript代码应该是：

var tableRef = document.getElementById("myList").getElementsByTagName("tbody")[0];
var newRow = tableRef.insertRow(tableRef.rows.length);
var newCell = newRow.insertCell(0);
var myTextTwo = "hello world";
var newText = document.createTextNode(myTextTwo);
newCell.appendChild(newText);

您还可以查看以下代码片段：

var tableRef = document.getElementById("myList").getElementsByTagName("tbody")[0];
var newRow = tableRef.insertRow(tableRef.rows.length);
var newCell = newRow.insertCell(0);
var myTextTwo = "hello world";
var newText = document.createTextNode(myTextTwo);
newCell.appendChild(newText);

var tableRef=document.getElementById（“myList”）.getElementsByTagName（“tbody”）[0]；
var newRow=tableRef.insertRow（tableRef.rows.length）；
var newCell=newRow.insertCell（0）；
var mytextwo=“你好世界”；
var newText=document.createTextNode（myTextTwo）；
appendChild（newText）
#我的列表{
边框：1px纯黑；
}
#空的{
边框底部：1px纯黑；
}

产品ID
品名
量
要使其正常工作，您需要：

1）将
[0]
放在
.getElementsByTagName（）
之后，如下所示，因为此方法返回一个元素数组，而
.getElementById（）
返回第一个实例：

var tableRef = document.getElementById("myList").getElementsByTagName("tbody")[0];

2）在您希望单元格所在的行中使用
.insertCell（）
，在本例中是
newRow
，而不是在表的
tbody
：

var newCell = newRow.insertCell(0);

正确的JavaScript代码应该是：

var tableRef = document.getElementById("myList").getElementsByTagName("tbody")[0];
var newRow = tableRef.insertRow(tableRef.rows.length);
var newCell = newRow.insertCell(0);
var myTextTwo = "hello world";
var newText = document.createTextNode(myTextTwo);
newCell.appendChild(newText);

您还可以查看以下代码片段：

var tableRef = document.getElementById("myList").getElementsByTagName("tbody")[0];
var newRow = tableRef.insertRow(tableRef.rows.length);
var newCell = newRow.insertCell(0);
var myTextTwo = "hello world";
var newText = document.createTextNode(myTextTwo);
newCell.appendChild(newText);


var tableRef=document.getElementById（“myList”）.getElementsByTagName（“tbody”）[0]；
var newRow=tableRef.insertRow（tableRef.rows.length）；
var newCell=newRow.insertCell（0）；
var mytextwo=“你好世界”；
var newText=document.createTextNode（myTextTwo）；
appendChild（newText）
#我的列表{
边框：1px纯黑；
}
#空的{
边框底部：1px纯黑；
}

产品ID
品名
量
getElementsByTagName
返回一个数组。您需要附加
[0]
以选择数组中的第一个元素

您还尝试在
tableRef
上使用
insertCell
，而您应该在
newRow
上使用它：


var tableRef=document.getElementById（“myList”）.getElementsByTagName（“tbody”）[0]；
var newRow=tableRef.insertRow（tableRef.rows.length）；
var newCell=newRow.insertCell（0）；
var mytextwo=“你好世界”；
var newText=document.createTextNode（myTextTwo）；
appendChild（newText）

产品ID
品名
量
getElementsByTagName
返回一个数组。您需要附加
[0]
以选择数组中的第一个元素

您还尝试在
tableRef
上使用
insertCell
，而您应该在
newRow
上使用它：


var tableRef=document.getElementById（“myList”）.getElementsByTagName（“tbody”）[0]；
var newRow=tableRef.insertRow（tableRef.rows.length）；
var newCell=newRow.insertCell（0）；
var mytextwo=“你好世界”；
var newText=document.createTextNode（myTextTwo）；
appendChild（newText）

产品ID
品名
量
是否检查JavaScript控制台是否有错误？@Alvin您从
.getElementsByTagName（）
中省略了
[0]
，并且您还尝试将新单元格添加到tbody，而不是必须添加的新行。查看我的答案以获得更详细的解释：您是否检查了JavaScript控制台中的错误？@Alvin您从
.getElementsByTagName（）
中省略了
[0]
，并且您还尝试将新单元格添加到tbody，而不是必须添加的新行。查看我的答案以获得更详细的解释：如果我想通过表中的第一个列元素进行for循环，该怎么办@这听起来是一个完全不同的问题。如果您的初始问题已解决，您应该打开一个新的，并将其标记为已回答。如果我想通过表中的第一个列元素进行for循环，该怎么办@这听起来是一个完全不同的问题。如果您的初始问题已解决，您应该打开一个新问题并将其标记为已回答。