JS中的宽高

一、屏幕的宽高（screen）

window.screen.height：:屏幕的高度

window.screen.width：屏幕的宽度

可以通过查看显示器的分辨率来获取

window.screen.availHeight：:屏幕的可用高度

window.screen.availWidth：屏幕的可用宽度

屏幕的可用高度要除去屏幕上的菜单栏的高度

~～～～～～～～～分割线～～～～～～～～～～～

二、浏览器的宽高（window）

window .innerHeight

window.innerWidth       

文档可视区域

window.screenTop：浏览器顶部距离屏幕顶部的高度   FireFox  只支持    screenY

window.screenLeft：浏览器左边与屏幕左边的距离    FireFox  只支持   screenX

window.outerHeight

window.outWidht

浏览器界面的宽高

~～～～～～～～～分割线～～～～～～～～～～～

三、元素相关的宽高（element）

element.clientHeight  元素内容的可视高度

element.clientWidth    元素内容的可视宽度    不包括边框、填充 和边距

element.offsetHeight  元素边框以内的高度

element.offsetWidth    元素边框以内的宽度    不包括边距,但包括边框和填充

element.offsetTop       元素顶部相对于父元素的偏移距离

element.offsetLeft       元素左侧相对于父元素的偏移距离   

element.scrollHeight   元素的整个宽度

element.scrollWidht     元素的整个宽度    包括滚动条

element.scrollLeft

element.scrollTop         偏移距离

element.offsetParent     返回定位偏移的容器

宽高是如此多，但也就三类：屏幕、浏览器、元素的宽高仔细分辨即可理解。