Die For-Schleife

Das Beispiel enthält ein Array mit Automarken. Sie werden beim HTML-Element <p id=“demo“>…</p> ausgegeben. Bei „document.getElementById(„demo“).innerHTML = text; wird mit …(„demo“). … auf das HTML-Element mit der <p id=“demo“></p> gezeigt und mit „innerHTML“ der Inhalt ausgelesen. In HTML ist eine id eindeutig und darf nur einmal vorkommen.

Eine For-Schleife durchläuft jedes Element des Array. Eine For-Schleife  wird mit For und dann runden Klammern festgelegt. Der erste Wert in den runden Klammern ist der Start-Wert auch Initialisierung genannt (Achtung: Javascript fängt bei 0 an zu zählen). Der zweite Wert ist die Bedienung wie lange die For-Schleife laufen soll. In unserem Beispiel wird I < cars.length verwendet, die Schleife wird also so lange ausgeführt wie Array-Elemente vorhanden sind. Das Array kann also beliebig viele Elemente beinhalten. Der dritte und letzte Wert ist die Änderung nach jedem Schleifen-Durchlauf. Mit I++ wird die Zählervariable um eins erhöht.

Es wird ausserhalb mit ‚let text = “ „;‘ eine globale Variable angelegt um den in der Schleife generierten Wert zu speichern. Mit <br> wird ein Zeilenumbruch eingeleitet. Was eine globale Variable ist siehst du weiter unter „JS-Scope“.

				
					<!DOCTYPE html>
<html>
<body>

<h4>Die For-Schleife</h4>

<p id="demo"></p>

<script>


function chooseCars(){
const cars = ["BMW", "Kia", "Audi" , "Toyota"];

let text = "";
for (let i = 0; i < cars.length; i++) {
text += cars[i] + "<br>";
}
document.getElementById("demo").innerHTML = text;
}
</script>

<button class="myButton" type="button" onclick="chooseCars()">Klick</button>

</body>
</html>

Die For-Schleife