1、JavaScript获取浏览器各种高度1JavaScript 获取浏览器各种高度最近做页面总涉及到元素的大小和位置，需要动态设置，每次都需要时现去网上查询，很多时候各种宽高容易混淆，各浏览器兼容的也不一样，网上搜索点资料，整理一下，亲自测试了一下，总结一下。这个是流传网络上很经典的一个图片，一般都能看明白，基本非常全面了，这里如果找不到需要的，就继续往下看吧。注意：头信息声明很关键：JavaScript获取浏览器各种高度2屏幕高度：window.screen.height屏幕宽度：window.screen.width这两个是屏幕分辨率大小，比如 1024*768，1440*900 等。屏幕可
2、用区域高度：window.screen.availHeight屏幕可用区域宽度：window.screen.availWidth什么是屏幕可用区域：简单理解就是去除任务栏之后的区域（当然还有别的工具栏等，看具体情况）浏览器距离屏幕上方的距离：window.screenTop浏览器距离屏幕左方的距离：window.screenLeft这个有浏览器的区别：IEIE在 frameset中（白、绿色部分的 window.screenTop）Chrome（frameset 也一样，也是浏览器距离屏幕顶部的高度）JavaScript获取浏览器各种高度3当前页面的可见区域宽度：document.docume
3、ntElement.clientWidth当前页面的可见区域高度：document.documentElement.clientHeight如果是在 frameset里面的 frame，则是 frame里面显示的宽度和高度头声明需要加上：document.body.clientHeight：当前文本内容宽度 body高度，指定了大小，则与浏览器大小无关，不指定或百分比，则可能与浏览器大小有关，与内容区有关。document.body.offsetWidth：body 宽度，带边框，如果有 2px的边框，则比 document.body.clientWidth 多 4px（左右都 2px）的大小
4、同理 Heightdocument.body.scrollTop：滚动条距离页面头的长度document.body.scrollLeft同理body滚动条的高度：document.body.scrollHeight， 3浏览器一样，都是整个滚动条高度页面滚动条高度：document.documentElement.scrollHeight ，和上面差不多，IE，chrome 和上面的一样宽度同理JavaScript获取浏览器各种高度4friefox会获取实际有元素的高度其他HTML 精确定位 :scrollLeft,scrollWidth,clientWidth,offsetWidth（同理高
5、度）scrollHeight ：获取对象的滚动高度。 scrollLeft ：设置或者获取位于对象左边界和窗口中今朝可见内部实质意义的最左端之间的距离 scrollTop ：设置或者获取位于对象最顶端和窗口中可见内部实质意义的最顶端之间的距离 scrollWidth ：获取对象的滚动宽度 offsetHeight ：获取对象相对版面或者由父坐标 offsetParent 属性指定的父坐标的高度 offsetLeft ：获取对象相对版面或者由 offsetParent 属性指定的父坐标的计算左侧位置 offsetTop ：获取对象相对版面或者由 offsetTop 属性指定的父坐标的计算顶端位置 event.clientX ：相对文档的程度座标 event.clientY ：相对文档的垂直座标 event.offsetX ：相对容器的程度坐标 event.offsetY ：相对容器的垂直坐标
