javascript - 更改 Img 属性并填充数组错误

Question

我对 JavaScript 相当陌生，并且很难理解为什么这一小段代码无法正常工作。在函数“change(slide)”中，如果我使用alert()函数显示传递给它的任何数组，则会显示预期结果。但是，当我希望将结果分配给图像的 src 属性时，我收到一条错误消息

未捕获的类型错误:无法读取 null 的属性“setAttribute” 未捕获的类型错误:无法读取未定义的属性“0”

我正在寻找最合适、最有效的方法将我的杂色 src 文本分配到我的图像中。

function loadSlider(){
    var stocker = new Array();

    for(var i = 0; i<15; i++){
        stocker.push("C:\\Users\\Rickep\\random_pics\\"+i+".jpg");

    }

    return stocker;
}   

var slider = new Array();
slider = loadSlider();
change(slider);



function change(slide){
document.getElementById('imageToFill').setAttribute('src',slide[1]);

}


</script>   

<div id="filler">
    <img id="imageToFill"></img>
</div>

Answer 1

您正在解雇change(slider);在创建 img 标签之前。

添加onload="change(slider);"添加到您的正文标记(并删除当前调用)应该可以修复。

如果您使用 JQuery，这也可能是 $('document').ready(function(){change(slider);});而不是当前的更改调用。

看看setInterval用于实际交换您的图像。

var currentSlide = 0;
$('document').ready(function(){
   setInterval(change, 5000); // 5 seconds
});

function change(){
  currentSlide = (currentSlide+1) % slider.length;
  document.getElementById('imageToFill').setAttribute('src',slider[currentSlide]);
}