Question

以下是用于创建从1到10的数字的顺序列表的代码。我想使用innerHTML获取此列表并在div“pagination”中输出。但是，当我执行脚本时，输出的唯一内容是数字10.当我使用document.write覆盖页面时，它会输出整个列表。有人能告诉我我做错了什么吗？感谢。

function generateNumbers() {
    var numbers = new Array();

    // start generating numbers
    for(var i = 1; i <= 10; i+= 1) {
        numbers.push( i );
    }

    // print numbers out.
    for(var i = 0; i < numbers.length; i++) {
        document.getElementById("pagination").innerHTML = numbers[i] + "<br>";
    }
}

并在HTML中：

<div id="pagination"></div>

Answer 1

嗯，你在每一步都覆盖innerHTML 尝试：

document.getElementById("pagination").innerHTML += numbers[i] + "<br>";

或更好：

// no for loop
document.getElementById("pagination").innerHTML = numbers.join("<br>");

Answer 2

for(var i = 0; i < numbers.length; i++) {
    document.getElementById("pagination").innerHTML = numbers[i] + "<br>";
}

这会在循环中每次替换innerHTML，因此您只能看到最后一次迭代。

尝试将=设为+=。

或者甚至更好，在字符串中构建它并使用该最终字符串将innerHTML设置一次。这将更快，因为它只需要将字符串解析为HTML一次而不是100次。

无法使用innerHTML输出完整的数字列表

2 个答案: