トラブルのinnerHTMLを使用して数字の完全なリストを出力

Question

以下は、私はinnerHTMLプロパティを使用してdivの「改ページ」に、このリストと出力を取りたいのですが、1から10までの数字の順次リストを作成するためのコードです。私が代わりにdocument.writeを使用してページを上書きする場合しかし、私は、スクリプトを実行すると、出力された唯一のものは、数10は、それが全体のリストを出力します。誰かが私が間違ってやっているものを私に伝えることができますか？おかげます。

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倍の文字列を解析するために持っているので、これは速くなります。