Question

可能重复：
Get a CSS value with JavaScript

你能告诉我为什么在加载页面时我无法获得这些css属性吗？

的javascript ：

function aviso(){
    alert("top: "+document.getElementById("divRojo").style.top);
    alert("position: "+document.getElementById("divRojo").style.position);
}

HTML：

<html>
    <head>
        <style type="text/css">
            #divRojo {
                width:100px;
                height:100px;
                background:red;
                left:200px;
                top:200px;
                position:static;
        }
    </style>
</head>

<body onload="aviso()">
    <div id="divRojo">
        Div Rojo
    </div>
</body>

</html>

提前致谢

Answer 1

这是因为DOMElement.style属性包含内联样式 - 它不包含通过CSS应用的样式规则。

使用getComputedStyle获取应用的样式：

var el = document.getElementById("divRojo");
alert(window.getComputedStyle(el).top);
alert(window.getComputedStyle(el).position);

JSFiddle

为什么我在加载页面时无法获得这些css属性？

1 个答案: