JavaScript更改img src

我正在尝试使用JavaScript制作一个图像滑块。我有一个id为HTML的按钮，希望根据数组中的位置更改按钮的src。这是我下面的代码

var index = 0;
var imageArray = [{'images/img1.jpg'},{'images/img2.jpg'},{'images/img3.jpg'},{'images/img4.jpg'}];

function moveToNextSlide()
{
    if (index >= imageArray.length -1)
    {
        index =-1;
    }
    var img = getElementById(img_start);
    index = index + 1;
    var currentSlide = imageArray[index];
    getElementByid(img_start).src="currentSlide";

}

---

看起来您正在尝试创建字符串数组。你有：

var imageArray = [{'images/img1.jpg'},{'images/img2.jpg'},{'images/img3.jpg'},{'images/img4.jpg'}];

大括号（

{}

）用于声明对象；每个字符串周围的大括号都是语法错误。对于字符串数组，只需将带引号的文字保留为不带大括号：

var imageArray = ['images/img1.jpg','images/img2.jpg','images/img3.jpg','images/img4.jpg'];

---

看起来您正在尝试创建字符串数组。你有：

var imageArray = [{'images/img1.jpg'},{'images/img2.jpg'},{'images/img3.jpg'},{'images/img4.jpg'}];

大括号（

{}

）用于声明对象；每个字符串周围的大括号都是语法错误。对于字符串数组，只需将带引号的文字保留为不带大括号：

var imageArray = ['images/img1.jpg','images/img2.jpg','images/img3.jpg','images/img4.jpg'];

---

有几个问题。首先，您需要使用正确的

array

语法

var imageArray = ['images/img1.jpg','images/img2.jpg','images/img3.jpg','images/img4.jpg'];

另外，您需要使用

文档。getElementById

并单独设置为

getElementById

将引用

窗口，而不是
文档

最后，您需要设置变量
currentSlide
，比如so
img.src=currentSlide，而不是字符串形式的“currentSlide”

function moveToNextSlide(){
    if (index >= imageArray.length -1){
        index =-1;
    }
    var img = document.getElementById('img_start');
    index = index + 1;
    var currentSlide = imageArray[index];
    img.src= currentSlide;
}

请参见此处的完整示例


var指数=0；
var imageArray=['http://www.profightdb.com/img/wrestlers/thumbs-600/1414330df8brethart.jpg', 'http://armpit-wrestling.com/wp-content/uploads/2016/06/bret-hart.jpg'];
document.body.onload=函数（）{
document.getElementById（'img_start'）。src=imageArray[0]；
};
函数moveToNextSlide（）{
如果（索引>=imageArray.length-1）{
指数=-1；
}
var img=document.getElementById（'img_start'）；
指数=指数+1；
var currentSlide=图像阵列[索引]；
img.src=当前幻灯片；
}
img{
最大宽度：100px；
}
p{
光标：指针；
}

单击此处有一些问题。首先，您需要使用正确的
array
语法

var imageArray = ['images/img1.jpg','images/img2.jpg','images/img3.jpg','images/img4.jpg'];

另外，您需要使用
文档。getElementById
并单独设置为
getElementById
将引用
窗口，而不是
文档

最后，您需要设置变量
currentSlide
，比如so
img.src=currentSlide，而不是字符串形式的“currentSlide”

function moveToNextSlide(){
    if (index >= imageArray.length -1){
        index =-1;
    }
    var img = document.getElementById('img_start');
    index = index + 1;
    var currentSlide = imageArray[index];
    img.src= currentSlide;
}

请参见此处的完整示例


var指数=0；
var imageArray=['http://www.profightdb.com/img/wrestlers/thumbs-600/1414330df8brethart.jpg', 'http://armpit-wrestling.com/wp-content/uploads/2016/06/bret-hart.jpg'];
document.body.onload=函数（）{
document.getElementById（'img_start'）。src=imageArray[0]；
};
函数moveToNextSlide（）{
如果（索引>=imageArray.length-1）{
指数=-1；
}
var img=document.getElementById（'img_start'）；
指数=指数+1；
var currentSlide=图像阵列[索引]；
img.src=当前幻灯片；
}
img{
最大宽度：100px；
}
p{
光标：指针；
}

单击此处
，什么不起作用？您可以添加您的html吗？@RossGlover。我在下面提供的答案有效吗？非常感谢，还澄清了我不理解的JavaScript的一些清晰的基本部分。还有什么不起作用？你能添加你的html吗？@RossGlover。我在下面提供的答案有用吗？非常感谢，还澄清了我不理解的JavaScript的一些清晰的基本部分。