Wie man ein Gitter mit Bildern in HTML bevölkert
<div class="grid-container">
<div class="grid-container">img 1 here</div>
</div>
Clean Caterpillar
<div class="grid-container">
<div class="grid-container">img 1 here</div>
</div>
<div class="grid-container">
<!-- images will come here -->
</div>
var imagePath="./image/seperate-";
var numberOfImage=100;
var parentDIV = document.getElementsByClassName("grid-container-parent")[0];
for(var i=0;i<numberOfImage;i++){
var tempDIV= document.createElement('div');
tempDIV.setAttribute('class','grid-container');
var innerHTML= `<img src='`+(imagePath+i)+`.png'></img>`
tempDIV.innerHTML=innerHTML;
parentDIV.appendChild(tempDIV);
}
const gridContainer = document.querySelector('.grid-container');
for (let i = 1; i < 101; i++) {
const img = document.createElement('img');
img.src = `path-to-img/seperate-${i}.png`;
gridContainer.append(img);
}