文档类型声明对document.body.clientHeight的取值影响

有时候我们想要获取浏览器可视窗口（页面）的宽度和高度，会使用

document.body.clientWidth
document.body.clinetHeight

但是，会发现在html文档头部的那个文档类型声明，会对document.body.clinetHeight发生区别。

1、不做任何文档类型声明时候，可以获取到页面的高度.（1366 662 是我电脑浏览器页面的宽度和高度）。

	


3333

2、文档声明使用，也可以获取到页面的高度

	


3333

3、其他的常见文档声明，都不能通过document.body.clientHeight获取到页面高度，body标签对应的高度一般是页面上填充内容撑开的高度。比如，例子代码中只有一个

333

,对应的body标签高度是21。

以下常用的 DOCTYPE 声明，都不能通过document.body.clientHeight获取到页面高度。

HTML 5方式

HTML 4.01方式

HTML 5方式

解决方案：
采用document.documentElement.clientHeight来替代document.body.clientHeight.

	


3333

因为现有的DOM中，才是根节点（也就是document才是根），而不再是body了。

所以想要获取整个页面的值，要用document.documentElement。
建议不管是哪一种文档类型声明，都采用document.documentElement.clientHeight来获取整个页面的值。