选择所有img标签并给它们一个src

Question

我尝试了很多方法来解决这个问题，但无法解决。

我的问题是我尝试<img>通过执行来选择所有内容

document.getElementsByTagName("img")

然后.src=text[x]像这样添加：

document.getElementsByTagName("img").src=text[x];

好吧，那是行不通的。我也尝试过使用这个：

var r = document.getElementsByTagName("img");
r.src=text[x];

再说一次，什么也没有。如果我使用这个代码（immg是所有的ID <img>）：

document.getElementById('immg').src=text[x];

它确实有效，但仅适用于第一个对象，因为它只搜索具有 ID 的一个元素immg，而不是所有元素。

我的完整代码：

第一个功能

function generateChar()
{
    var text = [
        "img/Water1.png",
        "img/Water2.png",
        "img/Water3.png",
        "img/Water4.png",
        "img/Water5.png",
        "img/Water6.png",
    ];
    var size = text.length;
    var x = Math.floor(size*Math.random());
    //document.getElementsByTagName("img").src=text[x];
    //document.getElementById('immg').src=text[x];
    var r = document.getElementsByTagName("img");

    r.src=text[x];
    //console.log(r);
}

其他有用的代码：

var nbDiv = 50;
for(var i = 0; i < nbDiv; i++){
    var div = document.createElement('div');
    var imgg = document.createElement('img');

    div.id = "d"+i ;
    imgg.id = "immg";
    imgg.className = "iimg";
    div.className = "movement timeSpan";
    document.querySelector('body').appendChild(div);
    div.appendChild(imgg);
}

并generateChar()在 for() 下调用

所以我想要实现的是给所有的img一张随机图片（这有效我只需要选择正确的项目）。

欢迎所有解决方案。

Answer 1

document.getElementsByTagName()返回一个HTMLCollection，它是一个可迭代的元素列表。

这是你应该做的：

let images = document.getElementsByTagName('img')

for (image of images) {
    x = Math.floor(Math.random() * text.length) // pick a random image URL
    image.src = text[x] // set the src to that URL
}

另外，我看到你在说：

immg<img>是所有人都有的ID

在多个元素上使用相同的 ID是错误的。千万不要这样做！ID 应该是唯一的。这也是为什么如果您使用getElementById它只返回找到的第一个元素，因为它假定您提供的 ID 对于该元素是唯一的。

您应该使用类，如下所示：

<img class='immg'>