通过DOM在一个div中创建多个img标签

Question

我不知道在创建我的 div 并为其分配一个 id 后究竟如何进行。我不能使用 JQuery 或其他 JavaScript 库。

到目前为止我有

var imageTabsDiv = document.createElement('div');
    imageTabsDiv.setAttribute('id', 'imageTabs');

但后来我遇到了心理障碍，不知道此后如何继续。

它应该在 html 中看起来像这样

<div id="imageTabs">
    <img src="images/pics/imageTab01"
    <img src="images/pics/imageTab02"
    <img src="images/pics/imageTab03"
    <img src="images/pics/imageTab04"
</div>

我想要一些关于如何从这里访问 div 标记抛出 DOM 的建议或提示。

Answer 1

一个快速for循环来创建您的img元素并分配适当的源，然后附加到div

for (var i = 1; i < 5; i++) {
    var img = document.createElement("img");
    img.src = "images/pics/imageTab0" + i;
    imageTabsDiv.appendChild(img);
}

当然，将新创建的内容附加到div某处。