javascript得到div css样式

Question

<style>
#div
{
width:100px;
height:100px;
border:1px solid ;
}
</style>
<script>
window.onload=function()
{
alert(document.getElementById("div").style.width);
}
</script>
<div id="div">hello</div>
为什么alert出来一个空值呢？
另外问一下document.getElementById("div")和div 的区别

Answer 1

alert(document.getElementById("div").offsetWidth);

Answer 2

mootools 1.1$('div').getStyle('width')    //out:100px

Answer 3

function getStyle(obj,which){
    return obj.currentStyle?
    obj.currentStyle[which]:
    document.defaultView.getComputedStyle (obj,null)[which];
}
getStyle(document.getElementById("div"),'width');

Answer 4

object.style.width
只是获取的元素中用style=''设置的css样式。
要获取当前作用在元素上的css样式要自定义一个函数来获取。
微软的IE是通过object.currentStyle[样式名字]来获取的，其他标准浏览器是用document.defaultView.getComputedStyle(object,null)[样式名字]来获取的

Answer 5

js写的没问题，关键是你在onload的时候，就去取div的样式是取不到的，浏览器样式解析未完成！

Answer 6

这里已经解析完成。css样式优先JS
document.getElementById("div").style.width 取的是
<div id="div" style="width:100px;">
1，2，3#都可行，看个人爱好

Answer 7

写在css里或者导入的css或者设置百分比，通过width获得不到具体的值，你可以通过
document.getElementById("xx").clientWidth获得他的实际大小，兼容主流浏览器。
offsetWidth是相对父标签的偏移吧？