<!DOCTYPE HTML>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
*{margin:0;padding:0;}
</style>
</head>
<body>
<script type="text/javascript">
var w1=document.documentElement.offsetHeight;
var w2=document.body.offsetHeight;
var w3=document.documentElement.offsetHeight||document.body.offsetHeight;
var h1=document.documentElement.offsetWidth;
var h2=document.body.offsetWidth;
var h3=document.documentElement.offsetWidth||document.body.offsetWidth;
document.write(w1+"<br />");
document.write(w2+"<br />");
document.write(w3+"<br />");
document.write(h1+"<br />");
document.write(h2+"<br />");
document.write(h3+"<br />");
</script>
<p> height、clientHeight、scrollHeight、offsetHeight区别图解 http://www.cnblogs.com/yuteng/articles/1894578.html </p>
</body>
</html>
因为是按顺序加载的,所以你在获取高度时是没有输出内容到body里面,自然高度为零,当你输出了之后,高度是有变化,但是值还是你当初没有内容时的值