html窗口内容的高度(不仅仅是视口高度)

gat*_*pia 1 html javascript css

我正试图获得html窗口内容的高度.这是内容的全高,而不是可见高度.我document.getElementsByTagName('html')[0].offsetHeight在FireFox中使用了一些(非常有限的)成功 .

然而,这在IE中失败,并且在使用绝对定位元素时在Chrome中失败(http://code.google.com/p/chromium/issues/detail?id=38999).

可用于重现此操作的示例html文件是:

<html>
    <head>
<style>
div {
    border:solid 1px red;
    height:2000px;
    width:400px;
}
.broken {
    position:absolute;
    top:0;
    left:0;
}
.fixed {
    position:relative;
    top:0;
    left:0;
}
</style>
<script language='javascript'>
window.onload = function () {
    document.getElementById('window.height').innerHTML = window.innerHeight;    
    document.getElementById('window.screen.height').innerHTML = window.screen.height;
    document.getElementById('document.html.height').innerHTML = document.getElementsByTagName('html')[0].offsetHeight;
}
</script>
    </head>
    <body>
        <div class='fixed'>
            window.height: <span id='window.height'>&nbsp;</span> <br/>
            window.screen.height: <span id='window.screen.height'></span> <br/>
            document.html.height: <span id='document.html.height'></span> <br/>
        </div>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

谢谢大家

Guido Tapia

gat*_*pia 5

我找到的最佳解决方案是:

document.documentElement.scrollHeight(scrollWidth宽度).安东尼上面提到过,这可能会在IE怪癖中出现问题,但这对我来说似乎没问题.

谢谢