javascript - 使用 javascript 更改 backgroundImage 以进行图像幻灯片放映。

Question

我正在尝试根据它的 id 更改 div 的背景图片，然后用几张图片制作幻灯片。我可以使用 javascript 更改背景，但很难弄清楚为什么我的循环不起作用。

主要.js

var spotlight = document.getElementById('spotlight');
var pics = ['image1.jpg', 'image2.jpg', 'image3.jpg'];
var totalPics = pics.length;
var i = 0;
function loop() {
    if(i > (totalPics - 1)) {
        i = 0;
    }
    spotlight.style.backgroundImage="url(/images/posts/'+pics[i]+')";
    i++;
    loopTimer = setTimeout('loop()',1000);
}
loop();

我正在使用 sass，但由于 javascript 是客户端，我猜这应该不会有任何不同吗？我在循环中做错了什么？我遵循了在 w3Schools 上找到的使用 javascript 更改样式的基本原则，并且它适用于静态图像，所以我猜我在循环中做错了什么。

谢谢

Answer 1

改变这个:

spotlight.style.backgroundImage="url(/images/posts/" + pics[i]+ ")";

和

loopTimer = setTimeout(loop,1000);

看看，是否有帮助。