Javascript样式问题

Question

我正在使用javascript来显示当前div的高度。

这是受影响区域的一个例子

//css
.test
{
height:1px;
}

#test1
{
margin:1px;
}

//html
<div id="test1" class="test"></div>

//javascript
var a = document.getElementById('test1');

a.style.height //how I access the style

Firebug说，样式的长度为0，高度为空。 如何获得正确的高度？

Answer 1

您需要查看计算的样式，而不是指定的样式。请参阅回答问题的Quirks mode's getstyle页面

  

有时您会想要查看默认文档视图的样式。例如，您给了一个宽度为50％的段落，但是如何看待用户中有多少像素？浏览器？

它解释了如何派生和使用getstyle函数，虽然它更容易使用像jquery这样提供简单css函数的库。

Answer 2

尝试使用a.offsetHeight代替a.style.height

jsfiddle demo

Answer 3

div身高取决于其子女。如果它为空，则为0。

你必须获得身高的代码是正确的，顺便说一句。

Answer 4

查看getComputedStyle方法。它应该做你想要的。有点跛，真的，我希望在DOM中处理得更好。