javascript - 在 JavaScript 中构建动态表

Question

所以我的最终目标是让用户输入三个或更多的单词，然后我必须将单词分开，IE 如果有 4 个单词，我必须构建 4 Rows，每个单词都有，我已经做了几个小时了只是无法弄清楚为什么 insertRow() 方法不起作用，它告诉我“无法调用未定义的 insertRow() 方法”

我在条件的 else 部分有什么：

//build table around input
    var table=document.getElementById('myTable');


    for(i=0; i<2; i++)
    {
    table.insertRow(i);
    table.insertCell(i);}

Answer 1

我看到的第一个问题是你调用.insertRow()了表 DOM 对象，但是你需要调用.insertRow()一行，而不是表。有关详细信息，请参阅insertCell 上的 MDN 。这是一些工作代码的示例：

function addWords(e) {

    var str = document.getElementById("words").value;
    var words = str.split(/[\s,]/);
    if (words.length && words[0]) {
        //build table around input
        var table = document.getElementById('myTable');

        for (var i = 0; i < words.length; i++) {
            var row = table.insertRow(-1);
            var cell = row.insertCell(-1);
            cell.innerHTML = words[i];
        }
    }
}

还有一个工作演示：http: //jsfiddle.net/jfriend00/3g3Qy/

Answer 2

您应该在 Row 对象上调用 insertCell。

var row = table.insertRow();
row.insertCell();

Answer 3

放一个console.log(table)后var table=...。如果它打印未定义，则问题是脚本运行得太快，您需要将脚本移动到页面的最底部，或者等待 DOM 加载。