Variable Anzahl an DIVs auf einer Seite
Hallo!
Ich habe als Grundlage eine Datenbank mit Datensätzen.
Jeder dieser Datensätze soll in Form eines DIVs auf der Seite angezeigt werden,
die Anzahl der Datensätze kann 0 oder 10 oder auch 100+ sein, desweiteren kann sich diese Anzahl jederzeit ändern.
Ich kann bereits diese Anzahl der Datensätze am Anfang der Seite auslesen und speichern. (Variable mit Anzahl der DIVs ist also vorhanden, kann sich aber halt ändern)
Wie kann ich jetzt diese Variable so benutzen, um ihr entsprechend viele DIVs zu erstellen?
Der hier verwendete Code
<style>
*{
margin:0;
padding:0;
}
body{
display: flex;
flex-direction: row;
flex-wrap: wrap;
width:100%;
}
.divs{
border:1px solid black;
}
.divs:nth-child(odd) {
background-color: turquoise;
}
.divs:nth-child(even) {
background-color: blue;
}
</style>
<body id="rtr"></body>
<script>
deine_variable=100;
var id_wo_erstellt_werden_soll= document.getElementById('rtr');
for (var i = 0; i < deine_variable; i++) {
var box = document.createElement("div");
box.style.width ="calc(10vw - 2px)";
box.style.height = "calc(10vw - 2px)";
box.className="divs";
box.id="box"+i;
id_wo_erstellt_werden_soll.appendChild(box);
}
</script>