1

好的,我有一个文字数组,其中有一些图像。我有一个空的 DIV,其中将执行 FOR LOOP 以显示 div 中数组中的所有图像。

var icons = [
    '<img src="images/1.png" width="30" height="30"/>',
    '<img src="images/2.png" width="30" height="30"/>',
    '<img src="images/3.png" width="30" height="30"/>'
    ];

    var lol = document.getElementById("div");

    for (var i=0; i<icons.length; i++) {
            lol.innerHTML = icons[i] ;
        }

问题是只显示最后一张图片而不是全部...

4

3 回答 3

1

那是因为您正在用当前图像覆盖前一个图像。如果要附加/连接所有图像,请使用+=

lol.innerHTML += icons[i];

处理此问题的更好方法是使用 DOM 处理:

var img = document.createElement("img");
img.setAttribute("src", icons[i]);

lol.appendChild(img);
于 2012-11-03T08:05:02.803 回答
0

你的代码覆盖了innerHTML 你可以附加innerHTML

尝试这个

lol.innerHTML += icons[i];

上面的代码是附加innerHTML

或者在 jquery 中你可以使用 append 函数

$('#div').append(icons[i]);
于 2012-11-03T08:08:08.700 回答
0

每次你做

lol.innerHTML = icons[i];

您将div 的内部 HTML替换icons[i]为. 连接所有图标元素,然后使用连接结果设置 div 的内部 HTML。

于 2012-11-03T08:05:53.800 回答