Question

我在尝试根据输入（列/行）值动态生成HTML表时遇到问题。

当我对下面循环中的值进行硬编码时（即不使用提示），它会创建正确数量的单元格。但是，在循环中使用x.length时，某些内容无法正常工作。

正常运作：

function createTable（）{

    // declare variables
    var body = document.body,
        table = document.createElement('table');


    // Begin creating table
    // for each row
    for(var r = 0; r < 8; r++) {

        // create row
        var tr = table.insertRow();

        // for each column
        for(var c = 0; c < 8; c++) {

            // create column
            var td = tr.insertCell();
            td.appendChild(document.createTextNode('Cell'));

        }
    }

    // append table to body
    body.appendChild(table);
}

createTable();

无法根据变量输入创建正确的单元格

function createTable（）{

    // declare variables
    var body = document.body,
        table = document.createElement('table'),
        rows = prompt("enter rows"),
        columns = prompt("enter columns");


    // Begin creating table
    // for each row
    for(var r = 0; r < rows.length; r++) {

        // create row
        var tr = table.insertRow();

        // for each column
        for(var c = 0; c < columns.length; c++) {

            // create column
            var td = tr.insertCell();
            td.appendChild(document.createTextNode('Cell'));

        }
    }

    // append table to body
    body.appendChild(table);
}

createTable();

Answer 1

rows和columns是字符串，这是他们拥有.length的唯一原因。您似乎希望将它们用作parsed数字，没有任何长度：

var body = document.body,
    table = document.createElement('table'),
    rows = parseInt(prompt("enter rows"), 10),
    columns = parseInt(prompt("enter columns"), 10);

for (var r = 0; r < rows; r++) {
    var tr = table.insertRow();
    for (var c = 0; c < columns; c++) {
        var td = tr.insertCell();
        td.appendChild(document.createTextNode('Cell'));
    }
}
body.appendChild(table);

Answer 2

使用parseInt(rows)和parseInt(columns)。此函数返回一个整数，但您必须检查输入是否真的是一个字符串表示的整数值。

在for循环中使用x.length的问题

2 个答案: