Я пытаюсь создать определенную HTML -структуру динамически с использованием javasacript, но не знаю, как это сделать ⇐ Html

[Anonymous]

Я получаю некоторые данные из API и хочу использовать их и показать их на моей HTML -странице, используя Pure Javascript. < /p>
Мой текущий HTML: < /p>
Load data

< /code>
Моя ожидаемая структура для использования данных API: < /p>














.
.
....

< /code>
Вот мой javascript: < /p>
function load() {
fetch("https://jsonplaceholder.typicode.com/photos")
.then(function(response) {
return response.json()
})
.then((response) => {
var counter = 0;

for (var data of response)
{
if (counter == 99) {
break;
alert("end");
} else {
var wrapper = document.createElement('div');
var img = document.createElement('img');
img.src = data.url;
img.setAttribute("class","img-class");
document.getElementById('main').appendChild(img);
document.getElementById('main').appendChild(img);
counter++;
}
}
})
}
< /code>
Я смог загрузить изображения, но теперь я хочу сделать правильную структуру.
здесь работает ссылка Copen. < /p>

Подробнее здесь: https://stackoverflow.com/questions/708 ... amically-b