js如何跨浏览器获取浏览器视口大小？

Question

根据js高程上的代码：

var pageHeight = window.innerHeight;
if (typeof pageHeight != "number") {
    if (document.compatMode == 'CSS1Compat') {
        pageHeight = document.documentElement.clientHeight;
    } else {
        pageHeight = document.body.clientHeight;
    }
}

这段代码在firefox、chrome上获取的是window.innerHeght，但是在ie上：

• ie9~11：window.innerHeight 985px

• ie7、8：document.body.clientHeight 24px

• ie5：document.body.clientHeight 981px

在ie7、8上的document.body.clientHeight实际上只是body的高度，不是整个浏览器视口的高度。

到底有什么方法能够跨浏览器获取浏览器页面高度？

Answer 1

document.documentElement.clientHeight 

手边没ie7、8没法测试效果。
但是一般我们做此设置

html,body{
    width:100%;
    height:100%
}

然后用document.body.clientHeight就行了

然后高程上document.compatMode == 'CSS1Compat'内的应该是针对doctype声明不是!doctype html的。所以ie7、8还是会走else。你可以加个断点或者console.log试试

Answer 2

同问 ！！！！