JQuery 获取浏览器窗口的高度和宽度讲解

在我们使用JQuery开发的过程中我们有时会根据浏览器窗口的位置定位，下面就讲解一下获取浏览器窗口尺寸的一些方法。

浏览器可视区域尺寸，注意这里指的不是浏览器窗口尺寸，也不是页面尺寸，我们可以想象成是我们能看到的文档面积大小

• 当前浏览器窗口中可视区域高度：$(window).height()
• 当前浏览器窗口中可视区域宽度：$(window).width()

浏览器整个文档的尺寸

• 当前文档的高度：$(document).height()
• 当前文档的宽度：$(document).width()

浏览器时下窗口文档body

• 窗口文档body的高度：$(document.body).height()
• 窗口文档body的宽度：$(document.body).width()

窗口文档body的总高度、总宽度 （包括padding、border、margin）

• 窗口文档body的总高度（包括padding、border、margin）：$(document.body).outerHeight(true)
• 窗口文档body的总宽度（包括padding、border、margin）：$(document.body).outerWidth(true)

滚动条相关值获取

• 滚动条到顶部的距离：$(document).scrollTop()
• 滚动条到左边的距离：$(document).scrollLeft()