scrollHeight scrollWidth clientHeight clientWidth
很多时候需要获得当前浏览器窗口大小，以获得好的页面布局，查查帮助无非就是：
document.body.scrollHeight
document.body.scrollWidth
document.body.clientHeight
document.body.clientWidth
document.documentElement.scrollHeight
document.documentElement.scrollWidth
document.documentElement.clientHeight
document.documentElement.clientWidth
在使用上面的方法时必须得注意，文档是否定义了DOCTYPE，检测是否定义DOCTYPE使用：
document.compatMode
其返回两种类型：BackCompat，CSS1Compat , 当文档类型定义了DOCTYPE时返回CSS1Compat
文档定义了DOCTYPE时使用：
document.documentElement.scrollHeight
document.documentElement.scrollWidth
document.documentElement.clientHeight
document.documentElement.clientWidth
否则使用：
document.body.scrollHeight
document.body.scrollWidth
document.body.clientHeight
document.body.clientWidth
但是，问题远没有这么简单，看看这个简单的页面的效果：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>scrollHeight,clientHeight,scrollWidth,clientWidth</title>
<script type="text/javascript" language="javascript">
function but_click1()
{
alert((document.compatMode != "CSS1Compat") ? document.body.scrollHeight : document.documentElement.scrollHeight);
}
function but_click2()
{
alert((document.compatMode != "CSS1Compat") ? document.body.clientHeight : document.documentElement.clientHeight);
}
function but_click3()
{
alert((document.compatMode != "CSS1Compat") ? document.body.scrollWidth : document.documentElement.scrollWidth);
}
function but_click4()
{
alert((document.compatMode != "CSS1Compat") ? document.body.clientWidth : document.documentElement.clientWidth);
}
</script>
</head>
<body style="margin:0;overflow-x:hidden;overflow-y:hidden">
<input type="button" height=40px onclick="but_click2()" value="clientHight" >
<br>
<input type="button" height=40px onclick="but_click4()" value="clientWidth" >
<br>
<input type="button" height=40px onclick="but_click1()" value="scrollHeight" >
<br>
<input type="button" height=40px onclick="but_click3()" value="scrollWidth" >
</body>
</html>
这个页面使用不同的浏览器打开，在ie7下无论是否定义DOCTYPE，scrollHeight获得的值都不会变化；同样FF也没有影响；只有对chrome有影响。当你实际运行上面的代码时，你还会发现3种浏览器中获得的值居然也不同！
结果大致是这样:
scrollHeight
有文档类型定义
在chrome 返回的是页面控件高度的和
在ie下 返回的是页面控件高度的和
在firefox 下返回整个窗口高度
scrollHeight
没有文档类型定义
在chrome 返回整个窗口实际高度
在ie 返回的是页面控件高度的和
在firefox下返回整个窗口高度
scrollWidth 在有无DOCTYPE还是在不同浏览器上结果基本一致，IE偏小，不知道是不是右侧的scrollbar影响了结果，我猜的^_^
也就是说无论在有无DOCTYPE定义的页面，在ie下用scrollHeight获得不了窗口高度,这时候就需要使用clientHeight来获得窗口高度！clientHeight效果基本一致。
反正我也说不明白那个浏览器更遵守规范，它们只会让你头疼。现在终于明白了为什么每次需求讨论都会头疼呢，写浏览器的大牛们对规范理解还有这么大偏差，何况同样的事由不同的人去描述，更何况里面还有鸟人呢！