Probleme Ausgabe vollständige Liste der Zahlen mit innerHTML-
-
25-09-2019 - |
Frage
ist die folgende Code eine sequentielle Liste von Zahlen von 1 bis 10 zu schaffen, würde Ich mag diese Liste nehmen und Ausgabe in der div „Paginierung“ mit innerHTML-. Allerdings, wenn ich das Skript ausführen, das einzige, was ausgegeben wird, ist die Nummer 10. Wenn ich die Seite mit document.write stattdessen überschreiben, es gibt die ganze Liste. Kann mir jemand sagen, was mache ich falsch? Danke.
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>";
}
}
und im HTML:
<div id="pagination"></div>
Lösung
Nun, Sie innerHTML
in jedem Schritt außer Kraft setzen.
Versuchen Sie:
document.getElementById("pagination").innerHTML += numbers[i] + "<br>";
Oder besser:
// no for loop
document.getElementById("pagination").innerHTML = numbers.join("<br>");
Andere Tipps
for(var i = 0; i < numbers.length; i++) {
document.getElementById("pagination").innerHTML = numbers[i] + "<br>";
}
Dies ersetzt die innerHTML
jedes Mal durch die Schleife, so dass Sie nur die letzte Iteration sehen.
Versuchen Sie, dass =
eine +=
zu machen.
oder noch besser, bauen sie in einer Reihe auf und stellen Sie die innerHTML
nur einmal mit diesem letzten String. Dies wird schneller sein, da es nur die Zeichenfolge als HTML zu analysieren hat einmal statt 100 mal.