0

我有一个简单的脚本，旨在控制台记录 div 背景图像的 xpos，但控制台显示空白。

这就是我所拥有的：

    var d = document.getElementById('div');
    console.log(d.style.backgroundPosition); //shows a blank line
    console.log(d.style.backgroundPosition.xpos); //undefined (obviously)

我很好奇为什么 backgroundPosition 会出现空白？

div的CSS是：

 #div{
    background-image: url('test.png');
    background-repeat: no-repeat;
    width:50px;
    height:50px;
    background-position: 0px 0px;
 }

根据要求的html：

<body>   
    <div id="div"></div>
</body>

有任何想法吗 ？

4

1 回答 1

1

该格式console.log(d.style.backgroundPosition);仅适用于内联设置的样式。要通过样式表获取样式集，请使用getComputedStyle：

window.getComputedStyle(d).getPropertyValue("background-position"); // returns 0px 0px

jsFiddle 示例

如果您只想要 X 或 Y 位置，请使用"background-position-x"or "background-position-y"。

于 2013-05-20T02:37:31.563 回答