document window高度的计算

js中，有三种方法能够确定浏览器窗口的尺寸（浏览器的视口，不包括工具栏和滚动条）。

对于Internet Explorer、Chrome、Firefox、Opera 以及 Safari：

window.innerHeight - 浏览器窗口的内部高度

window.innerWidth - 浏览器窗口的内部宽度

对于 Internet Explorer 8、7、6、5：(不支持window.innerHeight和window.innerWidth属性)

document.documentElement.clientHeight

document.documentElement.clientWidth

或者

document.body.clientHeight

document.body.clientWidth

文档内容无滚动条：

document.body.clientHeight = window.innerHeight = document.documentElement.clientHeight;

window.innerWidth >  document.body.clientWidth = document.documentElement.clientWidth

(大几个像素而已)

文档内容有滚动条：

document.body.clientHeight >> window.innerHeight = document.documentElement.clientHeight;

（远远大于）

实用的 JavaScript 方案（涵盖所有浏览器）：

var w = window.innerWidth  || document.documentElement.clientWidth  || document.body.clientWidth;

var h = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;

jQuery中

$(window).height();  浏览器显示网页内容的部分

$(window).width();

$(document).height();  整个网页文档流

$(document).width();
文档内容有滚动条：$(document).height() >> $(window).height();

jQuery 尺寸方法，返回不包括单位，

width() 方法设置或返回元素的宽度、高度（不包括内边距、边框或外边距）。

height()

innerWidth() 返回元素的宽度、高度（包括内边距）。

innerHeight()

outerWidth() 方法返回元素的宽度、高度（包括内边距和边框）

outerHeight()

outerWidth(true) 方法返回元素的宽度、高度（包括内边距、边框和外边距）。

outerHeight(true)

<div style="height:100px;width:300px ;padding:10px; margin:3px; border:1px solid blue"></div>

$("div").width():  300 
$("div").height(): 100

$("div").innerWidth()(): 320

$("div").innerHeight():  120

$("div").outerWidth():   322

$("div").outerHeight():  122 

$("div").outerWidth(true): 328

$("div").outerHeight(true): 128