有些文件我不能得到文件的高度(位置绝对在最底部)。此外,填充底部似乎在这些页面上不起任何作用,但在高度将返回的页面上起作用。相关案例:

http://fandango.com http://paperbackswap.com

在胡闹 jQuery的$(文档).height ();返回正确的值 文档。Height返回0 document.body.scrollHeight返回0

关于平装书互换: jQuery的$(文档).height ();TypeError: $(document)为空 文档。Height返回不正确的值 scrollheight返回错误的值

注意:我有浏览器级别的权限,如果有一些技巧在那里。


当前回答

下面的跨浏览器代码计算body和html元素的所有可能高度,并返回找到的最大值:

            var body = document.body;
            var html = document.documentElement;
            var bodyH = Math.max(body.scrollHeight, body.offsetHeight, body.getBoundingClientRect().height, html.clientHeight, html.scrollHeight, html.offsetHeight); // The max height of the body

一个工作的例子:

function getHeight() { var body = document.body; var html = document.documentElement; var bodyH = Math.max(body.scrollHeight, body.offsetHeight, body.getBoundingClientRect().height, html.clientHeight, html.scrollHeight, html.offsetHeight); return bodyH; } document.getElementById('height').innerText = getHeight(); body,html { height: 3000px; } #posbtm { bottom: 0; position: fixed; background-color: Yellow; } <div id="posbtm">The max Height of this document is: <span id="height"></span> px</div> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br />

其他回答

你甚至可以用这个:

var B = document.body,
    H = document.documentElement,
    height

if (typeof document.height !== 'undefined') {
    height = document.height // For webkit browsers
} else {
    height = Math.max( B.scrollHeight, B.offsetHeight,H.clientHeight, H.scrollHeight, H.offsetHeight );
}

或者以一种更jQuery的方式(因为你说过jQuery不会撒谎):)

Math.max($(document).height(), $(window).height())

对于那些在按需滚动页面时遇到困难的人来说,使用功能检测,我想出了这个方法来检测在动画滚动中使用哪个功能。

问题是document.body. scrolltop和document。documentElement在所有浏览器中总是返回true。

但是,实际上您只能使用其中一种滚动文档。d.body.scrollTop用于Safari和文档。根据w3schools为所有其他元素提供documentElement(参见示例)

元素。scrollTop适用于所有浏览器,但不适用于文档级别。

    // get and test orig scroll pos in Saf and similar 
    var ORG = d.body.scrollTop; 

    // increment by 1 pixel
    d.body.scrollTop += 1;

    // get new scroll pos in Saf and similar 
    var NEW = d.body.scrollTop;

    if(ORG == NEW){
        // no change, try scroll up instead
        ORG = d.body.scrollTop;
        d.body.scrollTop -= 1;
        NEW = d.body.scrollTop;

        if(ORG == NEW){
            // still no change, use document.documentElement
            cont = dd;
        } else {
            // we measured movement, use document.body
            cont = d.body;
        }
    } else {
        // we measured movement, use document.body
        cont = d.body;
    }

下面的跨浏览器代码计算body和html元素的所有可能高度,并返回找到的最大值:

            var body = document.body;
            var html = document.documentElement;
            var bodyH = Math.max(body.scrollHeight, body.offsetHeight, body.getBoundingClientRect().height, html.clientHeight, html.scrollHeight, html.offsetHeight); // The max height of the body

一个工作的例子:

function getHeight() { var body = document.body; var html = document.documentElement; var bodyH = Math.max(body.scrollHeight, body.offsetHeight, body.getBoundingClientRect().height, html.clientHeight, html.scrollHeight, html.offsetHeight); return bodyH; } document.getElementById('height').innerText = getHeight(); body,html { height: 3000px; } #posbtm { bottom: 0; position: fixed; background-color: Yellow; } <div id="posbtm">The max Height of this document is: <span id="height"></span> px</div> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br /> example document body content example document body content example document body content example document body content <br />

我撒谎了,jQuery为两个页面返回正确的值$(document).height();…我为什么要怀疑它呢?

要以跨浏览器/设备的方式获取宽度,请使用:

function getActualWidth() {
    var actualWidth = window.innerWidth ||
                      document.documentElement.clientWidth ||
                      document.body.clientWidth ||
                      document.body.offsetWidth;

    return actualWidth;
}