创建一个img元素's src另一个元素's background-image

Making an img element's src another element's background-image

本文关键字：元素 src 另一个 background-image img 创建 一个      更新时间：2023-09-26

我创建的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');

效果很好。

当元素与背景图像悬停在一起时触发

用这个代替:

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，在这种情况下，我们只是使用三元操作符从头开始。

相关文章：