screen.availHeight和window.height()之间的区别

Question

我正在我的浏览器(Firefox)上执行以下Javascript.

1. console.debug("Screen height ="+ screen.availHeight); //输出770

2. console.debug("Window Height ="+ $(window).height()); //输出210(我也使用jQuery)

两者有什么区别？是770像素和210毫米？

同样地,当我写的$(document).height()和$(window).height(),是有区别的.是什么原因？

Answer 1

window.outerHeight

它是屏幕上窗口的高度,它包括页面和所有可见浏览器的栏(位置,状态,书签,窗口标题,边框......).

这和jQuery 不一样$(window).outerHeight().

window.innerHeight 要么 $(window).height()

它是视口的高度,显示网站,只显示内容,没有浏览器栏.

document.body.clientHeight 要么 $(document).height()

它是视口中显示的文档高度.如果它高于$(window).height()您获得滚动条滚动文档.

screen.availHeight

它是浏览器窗口最大化时的高度,包括浏览器的栏.所以当窗口最大化时,screen.availHeight === window.outerHeight

screen.height

它只是匹配屏幕的分辨率.所以在1920×1080的屏幕上,screen.height将是1080.

screen.availHeight等于[ screen.height+操作系统的栏],如Windows上的任务栏,OS X上的停靠栏和菜单,或者如果您使用Linux,则固定在屏幕顶部或底部的任何内容.