Question

我不确定自己是否会完全疯狂，或者我的电脑是否出现问题。

我在下面有一个简单的JavaScript，但当我控制日志时，它完全是空的。尽管事实上有问题的元素清楚地附有风格。

<!doctype html>
<html>
<head>

<style>

    #para{  
        width: 100px;
        height: 100px;
        position: absolute;
        left: 200px;
        top: 10px;
        border: 1px solid red;      
    }

</style>
</head>

<body>

    <div id="para" class="paraDiv">This is the div</div>

<script>
        window.onload = function(){
            var d = document.getElementById('para');    
            console.dir(d);
            console.log(d.style.top);
        }

</script>

</body>
</html>

Answer 1

style属性仅通过元素的style属性获取有关内联应用的样式的信息。它不包含任何有关从其他元素继承或在样式表中声明的样式的信息。

相反，您需要window.getComputedStyle，它会为您提供您正在寻找的信息。

console.log(getComputedStyle(para).top);

id.styles什么都没有

1 个答案: