从 div 获取背景图像 src 并将其设置为图像的 src

Question

所以我试图在单击 div 时从中获取背景图像，并将其设置为页面其他位置的 img 元素的 src。问题是我收到一条错误消息，指出找不到该文件。我知道这与我分配给 img 的 src 的路径有关，但是我看不出代码有什么问题。

当点击有问题的 div 时，它会调用一个函数

document.getElementById('rice-bowl').onclick=openModal;

下面是实际功能

var openModal=function(){
        var image= $(this).css('background-image').slice(4,-1);
        console.log(image);
        var modalImg = document.getElementById("img01");
        modalImg.src = image;
        console.log(modalImg.src);
    }

这两个outputs to console按照这个逻辑应该是一样的，但是它们不是。再次感谢任何帮助！

Answer 1

这应该是：

$("#rice-bowl").click(function() {
    var bg = $(this).css('background-image');
    bg = bg.replace('url(','').replace(')','').replace(/\"/gi, "");
    var modalImg = document.getElementById("img01");
    modalImg.src = bg;
}

继续摇摆！

从 div 获取背景图像 src 并将其设置为图像的 src

Get background-image src from div and set that as an image's src

javascript

css

path

background-image

src