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

时间:2014-08-14 18:24:09

标签: javascript jquery css

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

完美无缺。

当具有背景图像的元素悬停在上面时,全部触发。

1 个答案:

答案 0 :(得分:2)

请改用:

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从头开始。