javascript - 使 img 元素的 src 成为另一个元素的背景图像

Question

我创建的 img 元素可以找到，除了我使用另一个图像的背景图像并将其作为该图像的来源的部分。这是我想出的代码。

var bg = element.css("background-image");
bg = bg.replace('url(','').replace(')','').replace('"', '');
bg = bg.slice(bg.search("images"));
imgElement.attr('src', '' + bg);

当我这样做

imgElement.attr('src', 'images/my-image.png');

它工作得很好。

当鼠标悬停在带有背景图片的元素上时，这一切都会被触发。

Answer 1

改用这个:

var bg = element.css("background-image");
bg = bg.replace(/^url\("(.*)"\)$/,'$1');
bg = bg.substring(bg.indexOf("images") > -1 ? bg.indexOf("images") : 0);
imgElement.attr('src', bg);

只需要一个正则表达式就可以去掉url(和结尾的)，并且使用.substring()直接处理字符串的方法。 .indexOf()找到字符串 "images" 的位置并将其传递给 substring，它会删除它之前的所有内容。如果未找到匹配项，indexOf 返回 -1，在这种情况下，我们只是从头开始使用 ternary operator .