Question

我有问题来获取div的背景网址

HTML：

<div id='test'></div>

CSS：

  #test { position:absolute; height:55px; width:85px; top:554px; left:197px;  background:url('images/1.jpg'); }

当我尝试通过使用下面的方式获取背景图像网址时，显示空白。

alert(document.getElementById("test").style.backgroundImage);

但有趣的是它适用于以下

document.getElementById("test").style.backgroundImage="url('images/1.jpg')";
alert(document.getElementById("test").style.backgroundImage);

注意：由于图片显示正确，因此网址没问题

Answer 1

你无法从外部CSS获取样式信息，因为JS只会查看DOM。我不确定它是否可行，但是当您通过样式标记直接在元素上设置CSS信息时，您应该能够获取并修改CSS信息：

<div style="position:absolute; height:55px; width:85px; top:554px; left:197px;  background:url('images/1.jpg');"></div>

Answer 2

是的，这是可能的，但你总是需要这个元素：

function getStyles (element) {
    element = document.getElementById(element);
    if (element.currentStyle) {
        return element.currentStyle;
    } else if (window.getComputedStyle) {
        return document.defaultView.getComputedStyle(element, null);
    }
}

这应该返回一个关联数组，其中包含给定元素的所有样式。

在很多情况下，有趣的是，您无法直接从JavaScript访问CSS样式，就像您尝试的那样。

javascript的背景图像问题

2 个答案: