Javascript 未填充div的图像

尝试使用javascript为类创建一个简单的幻灯片。由于某些原因，图像没有加载到div中

脚本：

var imageArray = ['img/br1.jpg', 'img/br2.jpg', 'img/br3.png', 'img/br4.gif', 'img/br5.jpeg', 'img/br6.jpeg', 'img/br7.jpeg'];
var i = 0;

function slideShow() {
document.getElementById('slideshowdiv').src = imageArray[i];

//increment i by 1
i++;

// checks if i is greater than or equal to the length
if(i >= imageArray.length) {
    // if true, resets value to 0
    i = 0;
};

//recall the change function every 2 seconds
timer = setTimeout('slideShow()', 2000);

}
function stopShow() {
    clearTimeout(timer);
};

html:

slideshowdiv没有.src，因为它是而不是

这：

应该是：

document.getElementById('slideshowdiv').src = imageArray[i];

---

我在这里看到一些潜在的bug

首先，我想您应该使用setInterval而不是setTimeout。用法相同，只需更改函数名即可。您可以像在onload调用中一样只调用一次slideShow函数，然后让超时连锁，但这会导致下一个问题

计时器变量未在幻灯片放映函数的作用域之外声明。这意味着您的stopShow功能将无法看到它。在本例中，您需要在完成所有代码后调用var timer=setIntervalslideShow，2000。实际上，通过在变量之前不声明var，您可以避免这个bug

最后，我认为设置元素的src属性不是您想要做的事情

最简单的解决方案是将标签附加到您的计算机上，例如：

---

不要对字符串使用setTimeout或setInterval，因为这就像邪恶的eval！改用函数：setTimeoutslideShow，2000检查控制台是否有错误？是的，没有@J08691 div的src属性是否加载图像？您不应该使用标记吗？您可以使用+=来避免重复div。innerHTML@trev你要写在div中吗？好的，现在图像加载到div中，但我需要它们相互叠加。现在它们只是层叠而下-edit-nevermind，明白了，只需删除额外的div.innerHTML。谢谢你的帮助@Biotoxy您不需要追加，只需替换所有div内容即可。谢谢，这是我刚才从上面的答案中添加的内容。谢谢你的信息。

document.getElementById('slideshowdiv').src = imageArray[i];

var div = document.getElementById('slideshowdiv');
div.innerHTML = div.innerHTML + '<img src="' + imageArray[i] + '" />';

var div = document.getElementById('slideshowdiv');
div.innerHTML = '<img src="' + imageArray[i] + '" />';