我如何使用JavaScript更改 通过按下按钮的图像？

Question

我正在建立一个网站，并且该网站的一部分具有背景图片。我创建了一个按钮并编写了一些JS代码来实现此目的，但是，它似乎无法正常工作。该按钮的ID为“模式”，该部分的ID为“ aboutSection”。我似乎找不到错误所在，我真的希望它不仅仅是错别字（我一直在仔细检查代码）。

这是我的JS代码：

let imgArray = new Array();

imgArray[0] = new Image();
imgArray[0].src = 'sky1.jpg';

imgArray[1] = new Image();
imgArray[1].src = 'sky2.jpg';

imgArray[2] = new Image();
imgArray[2].src = 'sky3.jpg';

var i = 0;


document.querySelector('#mode').addEventListener('click', () =>{
    i = i < imgArray.length ? ++i : 0;
    document.querySelector('#aboutSection').style.backgroundImage = imgArray[i];
})

谢谢您的帮助。

Answer 1

背景图片带有网址：

https://www.w3schools.com/html/html_images_background.asp

document.querySelector('#aboutSection').style.backgroundImage = "url('" + imgArray[i] + "')"

尽管在此示例中，数组应为字符串/路径的数组。