javascript - 如何将 src 属性分配给另一个元素的背景图像？

Question

我是 Javascript 的新手，我想创建一个 slider ，它根据纯 JS 中另一个元素的 src 更改其背景图像。 这是一段代码:

x = 1;
function image2() {
    var x = document.getElementById("imagecounter").textContent;
    var image2 = document.getElementById("image2").src;
    var slider = document.getElementById("slider");
    if (x == 2){
        slider.style.imageBackground = "url('image2');"} 
    }

代码的目的是建立一个控制幻灯片的数字，当数字发生变化时，带有 src 元素的图像与 div #slider 的背景图像交换。

完整代码:https://codepen.io/lucaslg20/pen/BeNGzv/

Answer 1

看起来你搞砸了 backgroundImage 样式的分配:

应该是:

if (x == 2){
  slider.style.backgroundImage = "url('" + image2 + "')";
}

您需要正确连接 image2 的值。

此外，我还查看了您的代码笔 HTML。您正在寻找: document.getElementsByClassName(" slider ")[0]

不是

document.getElementById("slider")

对于变量“slider”。