Question

我正在尝试创建元素并将其添加到表中。

function flaeche() {
    let tableID = "testTable";
    let x = document.createElement("TABLE");
    x.setAttribute("id", tableID);
    for (let argument of arguments) {
        let radius = ((argument*argument)*Math.PI).toFixed(2);
        addRow(argument,radius,tableID);
    }
}

function addRow(value, result, tableID){
    let table = document.getElementById(tableID);
    let row = table.insertRow(0);
    let cell1 = row.insertCell(0);
    let cell2 = row.insertCell(1);
    cell1.innerHTML = value;
    cell2.innerHTML = result;
}

如果我尝试运行代码，则会收到以下错误： TypeError: table is null的{{1}} 对应于 addRow line 30:5 我真的不知道为什么这么说，因为我对JavaScript相当陌生。感谢您的帮助。

Answer 1

您正在制作table元素，但没有将其添加到页面中。如果要稍后使用document.getElementById()查找表，则需要将表实际放置在DOM中。例如：

function flaeche() {
    let tableID = "testTable";
    let x = document.createElement("TABLE");
    x.setAttribute("id", tableID);

    // add table to the page somewhere
    // for example in the div named container
    let container = document.getElementById("container")
    container.appendChild(x)

    for (let argument of arguments) {
        let radius = ((argument*argument)*Math.PI).toFixed(2);
        addRow(argument,radius,tableID);
    }
}

function addRow(value, result, tableID){
    let table = document.getElementById(tableID);
    let row = table.insertRow(0);
    let cell1 = row.insertCell(0);
    let cell2 = row.insertCell(1);
    cell1.innerHTML = value;
    cell2.innerHTML = result;
}

flaeche(5, 6)

td {
  border: 1px solid #ddd;
  padding: 1em;
  
}

<div id="container"></div>

TypeError：将行添加到表中时，表为空

1 个答案: