Question

我想从这个css中获取背景图像我该怎么办？

<div  class="zoomWindow" style="overflow: hidden; background-position: -174.967px -146.847px; text-align: center; background-color: rgb(255, 255, 255); width: 700px; height: 450px; float: left; background-size: 1100px 1500px; z-index: 100; border: 0px solid rgb(136, 136, 136); background-repeat: no-repeat; position: absolute; background-image: url(&quot;http://cdn.shopclues.com/images/detailed/45044/UX8A34631_1475562297.jpg&quot;); top: 200.4px; left: 623.5px; display: none;">&nbsp;</div>

我的代码打开带有背景图片网址的新标签但域名仍在那里我不知道为什么

这是我的代码

var img = document.getElementsByClassName('zoomWindow');
console.log(img[0].style.backgroundImage.slice(4, -1));
var imagers =img[0].style.backgroundImage.slice(11, -2);
window.open(imagers);

Answer 1

使用DOM：

document.getElementById('image_1').style.backgroundImage;

JQuery的：

$('#image_1').css("background-image");

如果您只想要网址值，则需要再做一件事，去除url("http://cdn.shopclues.com/images/detailed/45044/UX8A34631_1475562297.jpg")函数的值url()。

Answer 2

您可以像这样获取background-image属性的值：

纯 JavaScript ：

var imageSrc = document.getElementByClassName("zoomWindow");
var imageLocation = imageSrc.style.backgroundImage;

或者，如果您安装了 jQuery 库：

var imageLocation = $(".zoomWindow").css("background-image");

希望这有帮助！

Answer 3

试试这个

var one =$('.zoomWindow').css("background-image");
console.log(one);

Answer 4

您可以在此处提取所应用的网址：

$(function(){

  var $zoomWindow = $('.zoomWindow'),
      backgroundImage = $zoomWindow.css('background-image'),
      extraction = backgroundImage.match(/[^url('][^')]*/),
      url = extraction[0];

  console.log(url); // -> http://cdn.shopclues.com/images/detailed/45044/UX8A34631_1475562297.jpg

});

如何在新标签或javasctipt弹出窗口中获取css background-mage

4 个答案: