Javascript JS-访问a<；表>；来自DOM（错误：“TypeError:tablex[0]未定义”）

我想将

头添加到一个

中，该

中没有

“id”

，但在

中有一个已知的

“id”

，因此我遍历DOM来查找它：

// search <table>
var c = document.getElementById("tablediv").children; 
var i; for(i = 0; i < c.length; i++) 
   { Output("- " + c[i].nodeName + "<br>"); // show progress
     if(c[i].nodeName == "TABLE") break; }

var tablex = c[i]; // that's the right object
var columns = tablex[0].length; // "TypeError: tablex[0] is undefined"
var row = tablex.insertRow(-1);
for(var i = 0; i < columns; i++) 
{  var headerCell = document.createElement("TH");
   headerCell.innerHTML = tablex[1][i];
   row.appendChild(headerCell);
}

//搜索
var c=document.getElementById（“tablediv”）.children；
var i；对于（i=0；i”）；//显示进度
if（c[i].nodeName==“TABLE”）break；}
var tablex=c[i]；//这是正确的目标
var columns=tablex[0]。长度；//“TypeError:表格[0]未定义”
var行=表x.insertRow（-1）；
对于（变量i=0；i

当

tablex[0]时，长度运行时会引发“类型错误：表格[0]未定义”

我猜
var tablex
是分配
c[I]的一种不正确的方式

你能告诉我怎么做吗

注意：表的第一个TD行包含列标题，因此我们要么将该行转换为TH，要么在插入第TH行后获取标题并删除TD行。
考虑到
tablex
最好是一个HTMLTableElement，
tablex[0]
没有定义。
考虑到
tablex
最好是一个HTMLTableElement，因此
tablex[0]
没有定义。
首先，您不需要这样遍历。使用
querySelector（'#tablediv table'）
直接查询表更容易。注意使用querySelector而不是querySelectorAll，这将返回节点内具有请求ID的第一个表。
最后的代码如下所示：

var table = document.querySelector('#tablediv table');
// Here you can add check if the table was found (not null) - I'll leave that to you
var firstRow = table.querySelector('tr');
var columns = firstRow.querySelectorAll('td'); // Or th if you have a header cells
console.log(`Number of columns: ${columns.length}`);

var headerRow = document.createElement('tr');
firstRow.parentNode.insertBefore(headerRow, firstRow);


for(var i = 0; i < columns.length; i++) {
  var headerCell = document.createElement("TH");
  headerCell.innerHTML = columns[i].innerHTML;
  headerRow.appendChild(headerCell);
}
firstRow.remove();

var table=document.querySelector（'tablediv table'）；
//在这里，您可以添加检查是否找到了表（非空）-我将留给您
var firstRow=table.querySelector（'tr'）；
var columns=firstRow.querySelectorAll（'td'）；//或者，如果你有一个标题单元格
log（`Number of columns:${columns.length}`）；
var headerRow=document.createElement（'tr'）；
firstRow.parentNode.insertBefore（headerRow，firstRow）；
对于（var i=0；i
首先，您不需要像那样进行遍历。使用
querySelector（'#tablediv table'）
直接查询表更容易。注意使用querySelector而不是querySelectorAll，这将返回节点内具有请求ID的第一个表。
最后的代码如下所示：

var table = document.querySelector('#tablediv table');
// Here you can add check if the table was found (not null) - I'll leave that to you
var firstRow = table.querySelector('tr');
var columns = firstRow.querySelectorAll('td'); // Or th if you have a header cells
console.log(`Number of columns: ${columns.length}`);

var headerRow = document.createElement('tr');
firstRow.parentNode.insertBefore(headerRow, firstRow);


for(var i = 0; i < columns.length; i++) {
  var headerCell = document.createElement("TH");
  headerCell.innerHTML = columns[i].innerHTML;
  headerRow.appendChild(headerCell);
}
firstRow.remove();

var table=document.querySelector（'tablediv table'）；
//在这里，您可以添加检查是否找到了表（非空）-我将留给您
var firstRow=table.querySelector（'tr'）；
var columns=firstRow.querySelectorAll（'td'）；//或者，如果你有一个标题单元格
log（`Number of columns:${columns.length}`）；
var headerRow=document.createElement（'tr'）；
firstRow.parentNode.insertBefore（headerRow，firstRow）；
对于（var i=0；i
我无法发布显示表格的HTML，因为它是由“tablediv”DIV中的脚本生成的（按CTRL+U获取源代码不会显示）。如果是我，我只需设置表格的
innerHTML
@Jenna，这看起来是个不错的主意，谢谢！我会试试。我不能发布显示表格的HTML，因为它是由“tablediv”DIV中的脚本生成的（按CTRL+U获取源代码时不会显示）。如果是我，我只需设置表格的
innerHTML
@Jenna，这看起来是个不错的主意，谢谢！我会试试的。@Gil请检查一下文档。HTMLTableElement不是数组，因此
tablex[0]
将是未定义的。很高兴知道它失败的原因，但这并不能解释如何正确执行。@Gil请检查文档中的错误。HTMLTableElement不是数组，因此
tablex[0]
将是未定义的。知道它失败的原因很好，但这并不能解释如何正确操作。我认为
querySelector
是实验性的？是否要为表中的每一列插入标题？意思是你的表没有th，你想在每个列的开头添加一行th？@pseudohumannoup，阅读所有支持它的主要浏览器的文档。我已经更新了答案，添加了标题行/单元格的动态注入。您仍然需要更改其中的文本，因为我不确定您的表中有什么。您可以使用
headerCell.innerHTML=firstRow.querySelector（'td:n类型（'+I+'）））。innerHTML
-未测试，但应该可以工作。。之后要删除前一行，只需添加：
firstRow.remove（）
I尽管
querySelector
是实验性的？是否要为表中的每一列插入标题？意思是你的表没有th，你想在每个列的开头添加一行th？@pseudohumannoup，阅读所有支持它的主要浏览器的文档。我已经更新了答案，添加了标题行/单元格的动态注入。您仍然需要更改其中的文本，因为我不确定您的表中有什么。您可以使用
headerCell.innerHTML=firstRow.querySelector（'td:n类型（'+I+'）））。innerHTML
-未测试，但应该可以工作。。之后要删除前一行，只需添加：
firstRow.remove（）