javascript获取style里设置样式的问题！

原来代码如下：

CSS Code:

<style type="text/css">
#dd{width:100px; height:100px; background:green; padding:10px; border:10px solid red; }
</style>

Xhtml Code:

<div id="dd" >dd</div>

Javascript Code:

<script>
window.onload=function(){
alert(document.getElementById("dd").style.height);
??? }
</script>

弹出框结果为空！Why?

现在，还是原来的javascript代码，我将CSS和XHMTL代码稍微一下：

CSS Code:

<style type="text/css">
#dd{ background:green; padding:10px; border:10px solid red; }
</style>

Xhtml Code:(将宽和高的样式写在这里)

<div id="dd" style="width:100px; height:100px;" >dd</div>

弹出框结果为100px！，Why ??

难道与CSS权重有关？百思不得其解！先记录下来，以后找答案！

if (!window.getComputedStyle) { window.getComputedStyle = function(el, pseudo){ this.el = el; this.getPropertyValue = function(prop){ var re = /(\-([a-z]){1})/g; if (prop == 'float') prop = 'styleFloat'; if (re.test(prop)) { prop = prop.replace(re, function(){ return arguments[2].toUpperCase(); }); } return el.currentStyle[prop] ? el.currentStyle[prop] : null; } return this; } }

上面的代码是为了挂浏览器，解释一下：window.getComputedStyle IE不支持，因此用currentStyle代替。不过里面有写property name不同，因此用了正则处理。
然后执行：

var dd = document.getElementById('dd');
var h=window.getComputedStyle(dd,'height').height;
alert(h);

就OK啦。


2 楼 hao3721 2010-07-19 谢谢楼上兄弟，我在网上找了资料，还是IE和FF各自为战的问题，还有其他七七八八的问题吧。我认为
var dd=document.getElementById('dd');
window.getComputedStyle?window.getComputedStyle(dd,null).width:dd.currentStyle.width;
这样就可以了吧！