Menu
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.
225
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 the document object (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, had padding:10px, then your <body> element will definitely differ in effective size to the whole document entirely.
Now, don't get me wrong: document and document.body can 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.
68
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
