JS "Window" width-height vs "screen" width-height?

Question

I am wondering a little when I look at this code:

// Get the screen height and width
var maskHeight = $(document).height();
var maskWidth = $(window).width();

...

// Get the window height and width
var winH = $(window).height();
var winW = $(window).width();

What is the difference between $(document).height(); and $(window).height();?

Answer 1

Window is the top level client side object, which contains the document. This jsFiddle shows that both $(window).height() and $(document).height() return the same value: http://jsfiddle.net/jackrugile/5xSuv/

Window is the size of the viewport and does not include any of the chrome or browser interface, if I am not mistaken. I believe that the values of both will always be the same, unless you are referencing something like an iframe within a window.