嘿，我看到你的轮播函数在运行，但图片没法正常显示——问题其实出在一个容易忽略的小细节上，咱们来快速搞定它：

核心问题：错误赋值了Image对象而非图片路径 #

你创建了Image对象数组，但页面上的<img>元素的src属性需要的是图片的URL字符串，而不是Image对象本身。当前代码里的slide.src = images[i];是把整个Image对象直接赋值给了src，浏览器根本无法识别这个值，自然显示不出图片。

修复方案 #

只需要把赋值语句改成取Image对象的src属性即可：

slide.src = images[i].src;

另外还有个小优化点：setTimeout("changeImg()", time)这种传递字符串的方式不推荐，JavaScript需要额外解析字符串，换成直接传递函数引用更高效规范：

setTimeout(changeImg, time);

修改后的完整JavaScript代码 #

var i = 0 
var time = 3000; 
var images = new Array(3) 
var slide = document.getElementById("slide") 

images[0] = new Image(); 
images[0].src = "picture/michael-jordan.jpg" 
images[1] = new Image(); 
images[1].src = "picture/usain-bolt.jpg"; 
images[2] = new Image(); 
images[2].src = "picture/zidane.jpg" 

console.log(images) 

function changeImg() { 
  // 修正：取Image对象的src属性
  slide.src = images[i].src; 
  if(i < images.length - 1) { 
    i++ 
  } else { 
    i = 0; 
  } 
  // 优化：直接传递函数引用
  setTimeout(changeImg, time) 
} 

window.onload = changeImg;

额外建议 #

1. 简化代码：如果不需要提前预加载图片，你甚至可以直接存储URL字符串数组，不用创建Image对象，代码会更简洁：

var images = [
  "picture/michael-jordan.jpg",
  "picture/usain-bolt.jpg",
  "picture/zidane.jpg"
];

// 此时changeImg里直接赋值即可：
slide.src = images[i];

2. 检查图片路径：如果修复后还是不显示，打开浏览器控制台的「Network」标签，查看图片请求的状态——如果是404，说明你的图片路径不对，确认picture文件夹和HTML文件是否在同一目录下，或者路径是否拼写错误。

3. 预加载优化：如果你用Image对象是为了预加载图片，最好等所有图片加载完成后再开始轮播，避免初始状态显示空白。可以通过监听load事件实现：

var loadedCount = 0;
images.forEach(img => {
  img.onload = function() {
    loadedCount++;
    if(loadedCount === images.length) {
      // 所有图片加载完成后再启动轮播
      changeImg();
    }
  };
});

// 注意这里要去掉window.onload=changeImg; 换成上面的逻辑

内容的提问来源于stack exchange，提问作者alwaysLearning