JavaScript:无法警告输出值

Question

代码非常简单。

HTML:

<div class="simpleDiv" id="Child1" onmouseover="expandDiv(this);"></div>

CSS:

.simpleDiv {
    background-color: red; 
    width: 100px; 
    height: 50px; 
    margin: 5px; 
    margin-left: 50px; 
    opacity: 1;
}   

JavaScript:

function expandDiv(object){
    alert(document.getElementById(object.id).style.height);
} 

为什么我无法像这样提醒 div 的高度？如果我使用函数 hasAttribute 来提醒 id 或类，那么工作正常，但无法提醒元素的 css 属性。

感谢任何帮助!

Answer 1

为什么不只是alert(object.style.height)？

无论如何，它不起作用的原因是 elem.style.property 仅适用于内联 style="..." 属性。要考虑所有样式，您需要:

alert(window.getComputedStyle(object).height)

旧版本的 IE 不支持此功能，但这是一个非常简单的填充程序:

window.getComputedStyle = window.getComputedStyle || function(e) {return e.currentStyle;};