前端高度寬度集合

平常開發鬧人的寬高問題，爲了方便專心完成需求，所遇到的高度就在這總結下！ 一. 網頁高度 網頁可見區域寬：document.body.clientWidth 網頁可見區域高：document.body.clientHeight 網頁可見區域寬：document.body.offsetWidth(包括邊線的寬) 網頁可見區域高：document.body.offsetHeight(包括邊線的寬) 網頁正文全文寬：document.body.scrollWidth 網頁正文全文高：document.body.scrollHeight 網頁被捲去的高：document.body.scrollTop 網頁被捲去的左：document.body.scrollLeft 網頁被捲去的高：document.documentElement.scrollTop 網頁被捲去的左：document.documentElement.scrollLeft 二. 屏幕高度 屏幕分辨率的高 ：window.screen.height 屏幕分辨率的寬 ：window.screen.width 屏幕可用工做區高度：window.screen.availHeight 屏幕可用工做區寬度：window.screen.availWidth 三. client寬度高度的區別 document.body.clientWidth ==> BODY對象寬度 document.body.clientHeight ==> BODY對象高度 document.documentElement.clientWidth ==> 可見區域寬度 document.documentElement.clientHeight ==> 可見區域高度 四. jQuery的表示 窗口可視區域高度 ： $(window).height() 　 窗口文檔的高度 ：$(document).height() body的高度 　　　：$(document.body).height() 五. 常見高度釋義 scrollHeight : 獲取對象的滾動高度。 scrollLeft : 設置或獲取位於對象左邊界和窗口中目前可見內容的最左端之間的距離 scrollTop : 設置或獲取位於對象最頂端和窗口中可見內容的最頂端之間的距離 scrollWidth : 獲取對象的滾動寬度 offsetHeight : 獲取對象相對於版面或由父座標 offsetParent 屬性指定的父座標的高度 offsetLeft : 獲取對象相對於版面或由 offsetParent 屬性指定的父座標的計算左側位置 offsetTop : 獲取對象相對於版面或由 offsetTop 屬性指定的父座標的計算頂端位置 event.clientX 相對文檔的水平座標 event.clientY 相對文檔的垂直座標 event.offsetX 相對容器的水平座標 event.offsetY 相對容器的垂直座標 document.documentElement.scrollTop 垂直方向滾動的值 event.clientX+document.documentElement.scrollTop 相對文檔的水平座標+垂直方向滾動的