Javascript 如何显示阵列中的图像（用户控制的交通灯） var TrafficLights=新阵列 图像[0]=traffic-light-red.jpg； 图[1]=红绿灯-red-amber.jpg； 图[2]=traffic-light-green.jpg； 图[3]=traffic-light-amber.jpg； var TrafficLightImages=[image1，image2，image3，image4] 换灯！ var阶跃=1； 变量i=0 函数更新图像{ 对于i=0；i+交通灯[i]+； //->

上面的几行是代码。如何从一个数组中旋转不同的交通灯图像，显示它们，并且只在按下按钮时更改图像

---

如果可能，请显示完整的工作脚本。

文档。只写在文档末尾添加HTML

要更改现有标记，您需要一个事件处理程序来更改图像DOM节点的“src”属性

<script>
function changeImage(image_name) {
    var img = document.getElementById("image_id");
    img.src = image_name;
}
</script>

<img src='placeholder.png' id='image_id' />
<input type='button' value='Set Green' onClick='changeImage("traffic-light-green.jpg");' />
<input type='button' value='Set Red' onClick='changeImage("traffic-light-red.jpg");' />

---

起初，图像1不存在，图像[1]不属于主题，但值得一提。您的注释过多，使代码更难阅读。slideit方法在哪里？？