Javascript 为什么不'；我的图像是否按预期更新？
我在这里找到了一个对我来说非常直接和简单的指南： 但是在我的实现中，它不起作用。图像不会显示或更改。有什么提示吗 编辑：与建议的复制不同。现在，changeImage之后的括号已被删除，该函数将重复，但不显示任何背景图像的问题仍然存在 第二次编辑：我还尝试删除buildImage后的括号，结果相同（没有显示背景图像）Javascript 为什么不'；我的图像是否按预期更新？,javascript,html,Javascript,Html,我在这里找到了一个对我来说非常直接和简单的指南： 但是在我的实现中，它不起作用。图像不会显示或更改。有什么提示吗 编辑：与建议的复制不同。现在，changeImage之后的括号已被删除，该函数将重复，但不显示任何背景图像的问题仍然存在 第二次编辑：我还尝试删除buildImage后的括号，结果相同（没有显示背景图像） var images=['file:///Users/karin/PROJECTS/PORTFOLIO/pupal%20stage/img/stage12.jpg', 'fil
var images=['file:///Users/karin/PROJECTS/PORTFOLIO/pupal%20stage/img/stage12.jpg',
'file:///Users/karin/PROJECTS/PORTFOLIO/pupal%20stage/img/stage34.jpg',
'file:///Users/karin/PROJECTS/PORTFOLIO/pupal%20stage/img/stage56.jpg'];
var指数=0；
函数buildImage（）{
console.log（“设置图像”）；
document.getElementById（'pupa'）.style.backgroundImage='url（'+images[index]+'）；
}
函数changeImage（）{
索引++；
如果（index>=images.length）index=0；
console.log（“更改图像”）；
document.getElementById（'pupa'）.style.backgroundImage='url（'+images[index]+'）；
}
buildImage（）；
设置间隔（changeImage，3000）；
<html>
<head>
<style>
#pupa
{
width:300px;
height:300px;
background-position:center;
background-repeat:no-repeat;
background-size:cover;
}
</style>
</head>
<body>
<div id="pupa"></div>
<script>
var images = ['img/stage12.jpg',
'img/stage34.jpg',
'img/stage56.jpg'];
var index = 0;
document.getElementById('pupa').style.backgroundImage = `url(${images[index]})`;
setInterval(function(){
index=(++index >= images.length)?0:index;
console.log(`changing image of index : ${index}`);
document.getElementById('pupa').style.backgroundImage = `url(${images[index]})`;
},3000);
</script>
</body>
</html>
#蛹
{
宽度：300px；
高度：300px；
背景位置：中心；
背景重复：无重复；
背景尺寸：封面；
}
var images=['img/stage12.jpg'，
“img/stage34.jpg”，
‘img/stage56.jpg’]；
var指数=0；
document.getElementById（'pupa'）.style.backgroundImage=`url（${images[index]}）`；
setInterval（函数（）{
索引=（++index>=images.length）？0:索引；
log（`changing index的映像：${index}`）；
document.getElementById（'pupa'）.style.backgroundImage=`url（${images[index]}）`；
},3000);
确保根据需要更改宽度、高度、背景大小、图像名称、路径等。如果您将图像添加到html页面所在文件夹中名为img的文件夹中，此代码将起作用
<html>
<head>
<style>
#pupa
{
width:300px;
height:300px;
background-position:center;
background-repeat:no-repeat;
background-size:cover;
}
</style>
</head>
<body>
<div id="pupa"></div>
<script>
var images = ['img/stage12.jpg',
'img/stage34.jpg',
'img/stage56.jpg'];
var index = 0;
document.getElementById('pupa').style.backgroundImage = `url(${images[index]})`;
setInterval(function(){
index=(++index >= images.length)?0:index;
console.log(`changing image of index : ${index}`);
document.getElementById('pupa').style.backgroundImage = `url(${images[index]})`;
},3000);
</script>
</body>
</html>
#蛹
{
宽度：300px；
高度：300px；
背景位置：中心；
背景重复：无重复；
背景尺寸：封面；
}
var images=['img/stage12.jpg'，
“img/stage34.jpg”，
‘img/stage56.jpg’]；
var指数=0；
document.getElementById（'pupa'）.style.backgroundImage=`url（${images[index]}）`；
setInterval（函数（）{
索引=（++index>=images.length）？0:索引；
log（`changing index的映像：${index}`）；
document.getElementById（'pupa'）.style.backgroundImage=`url（${images[index]}）`；
},3000);
确保根据需要更改宽度、高度、背景大小、图像名称、路径等。这是否回答了您的问题？我尝试在changeImage之后删除括号，现在该部分工作：）谢谢！但是图像仍然没有显示为div的背景（它根本没有背景）请尝试更改
file:///Users/karin/PROJECTS/PORTFOLIO/pupal%20stage/img/stage12.jpgimg/stage12.jpghtmlfile:///Users/karin/PROJECTS/PORTFOLIO/pupal%20stage/img/stage12.jpgimg/stage12.jpghtml