Geek Answers Handbook

JQuery returns wrong document height

I am using Webview in Cocoa (Mac) and I am trying to get the correct height of the document. Doing the usual thing webview.mainFrame.frameView.documentView.bounds.size.heightseems to work fine in all cases except the ones I just found:

http://www.medium.com .

When I try to do this on this site, I get a document height of about 500, when the actual height of the document is more like 2000+, since I need to scroll through several screens to get to the end.

I tried resorting to evaluating javascript in webview to get the actual height using approaches such as those listed here: How to get the height of an entire document using JavaScript?

But they also gave grossly incorrect values, like my original approach. Even going to this page, loading jQuery, then doing things like $ (document.body) .height () gives a grossly incorrect value. Does anyone know what is going on? Is there any other way to get a reliable document height?

I noticed that the heights reported by the inspector in chrome were also confused. In these screenshots, you can see that the height of document.body is reported as being less than the height of one of its child nodes.

medium.com body height in chrome inspectormedium.com body-> child div height in chrome inspector

+4
source share
7 answers

The thing with this page is as follows:

HTML Body ( ) 100%, . 500 . ? ... div : auto ( 4000 )

, , div ( - )

, 500 , , , :

document.querySelectorAll(".scrolling-region")[0].scrollHeight

4133px, .

:)

+9

, html,body{height:100%} .screen-scroll,.screen-scroll>body{overflow:hidden} - . height:100% overflow:hidden, html body 100% overflow, document , window .

, header, nav, and .background-white, 4222, 500, .

- :

var hh = $('header').height(),
    nh = $('nav').height(),
    bh = $('.background-white').height(),
    docHeight = hh+nh+bh;
alert(docHeight);//test
+2

, window.innerWidth/Height, .

.

document.body.offsetHeight

- +8000 px, . 590 ( ).

, .

  • Molle
+1
var D = document;
        var docHeight = Math.max(
        Math.max(D.body.scrollHeight, D.documentElement.scrollHeight),
        Math.max(D.body.offsetHeight, D.documentElement.offsetHeight),
        Math.max(D.body.clientHeight, D.documentElement.clientHeight)
    );

var height1= $(window).height(),
    height= $(document).height();

, .

0

? $ ().ready(() {..});

Chrome. js. F5, , $(document).ready

0

. , window.onload, .

0

More articles:


All Articles