Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
I have been googling for a while, but still could not find why
is $(document).height() different from $(document.body).height()?
What’s more, could anyone tell me the corresponding relation between the height methods
in jQuery and the raw JavaScript ones?
For example, $(document).height() is equivalent to document.documentElement.scrollHeight.
Because the
<body>element in your HTML is just another block element (much like a<div>), and as any block element, it can have dimensional styling (margin,padding,width,height, etc).Considering that, the “size” of the
<body>element does not need to correspond directly to the size of thedocumentobject (which corresponds to your whole HTML document as rendered, as a whole). One good reason is that the<body>element is also inside the<html>element, which is also a block element, and can have its own respective dimensionals.If your
<html>element, for example, hadpadding:10px, then your<body>element will definitely differ in effective size to the wholedocumententirely.Now, don’t get me wrong:
documentanddocument.bodycan have the exact same size (try checking StackOverflow’s for example), but you have to understand that<body>is just another HTML block you can manipulate via CSS.