如何使用javascript放置图像？

我正在制作一个游戏，随机挑选一张照片，让这张照片取代之前的照片，但我不知道如何用javascript编码

var trash = [["recycle1.png", "recycle2.png","recycle3.png"],["bio1.png","bio2.png","bio3.png"],["nonbio1.png", "nonbio2.png", "nonbio3.png"]];

function game ()
    {var trashKind = trash[Math.floor(Math.random()*trash.length)][Math.floor(Math.random()*trash.length)];
    document.getElementById("trash").src = "../images/" + trashKind;};

game ();

这是我尝试过的，但不起作用

这是javascript

var trash = [["recycle1.png", "recycle2.png","recycle3.png"],["bio1.png","bio2.png","bio3.png"],["nonbio1.png", "nonbio2.png", "nonbio3.png"]];

function game ()
    {var trashKind = trash[Math.floor(Math.random()*trash.length)][Math.floor(Math.random()*trash.length)];
    document.getElementById("trash").src = "../images/" + trashKind;};

game ();

这是html

<div><img id="trash" src="../images/recycle2.png"></div>

如果html是：

<img src="random-picture.jpg" alt="random-picture" id="theImage">

注意``

---

您可以从这里轻松地继续

而不是创建二维数组，您可以像一维数组一样创建，因为它会影响索引

var trash = ["recycle1.png", "recycle2.png","recycle3.png","bio1.png","bio2.png","bio3.png","nonbio1.png", "nonbio2.png", "nonbio3.png"];

---

如果您同时只显示一个图像，并且图像HTML标记已经在DOM中，那么您只需要编写一点JavaScript代码来处理该图像标记的源代码更改

每隔一定时间使用间隔更改图像 如果图像HTML标记具有id属性，则可以在JavaScript中引用该图像：

在JavaScript中，定义要使用的图片数组，代码会根据数组大小进行调整，因此无论向数组中添加多少图像，代码都会随机化数组中的图像

JavaScript: 这应该对你有好处。你可以看到它在工作

var gameImage = document.querySelector("#image"),
    images = ["recycle1.png", "recycle2.png","recycle3.png","bio1.png","bio2.png","bio3.png","nonbio1.png", "nonbio2.png", "nonbio3.png"];
function grn(min, max) {
    return parseInt(Math.random() * (max - min) + min);
}
function game(){
  let newImage = images[grn(0,images.length)];
  gameImage.src = newImage;
  gameImage.alt = newImage;
}
setInterval(game,1000);