可見域:即可以被顯示出來的區域,由起高度大小決定,包括所有內邊距、滾動條(被滾動出去的內容)和邊框大小。
網頁可見域寬(不包括邊框):document.body.clientWidth 包括內容和內邊距,整個文檔寬度,即使被卷出去擋住的
網頁可見域高(不包括邊框):document.body.clientHeight 包括內容和內邊距,整個文檔高度,即使被卷出去擋住的
網頁可見域寬(包括邊框):document.body.offsetWidth 包括內容、內邊距、邊框,整個文檔寬度,即使被卷出去擋住的
網頁可見域高(包括邊框):document.body.offsetHeight 包括內容、內邊距、邊框,整個文檔寬度,即使被卷出去擋住的
網頁正文全文寬:document.body.scrollWidth 基本等同於document.body.clientWidth
網頁正文全文高:document.body.scrollHeight 基本等同於document.body.clientHeight
網頁被卷去的高:document.body.scrollTop
網頁被卷去的左:document.body.scrollLeft
網頁正文部分上:window.screenTop
網頁正文部分左:window.screenLeft
屏幕分辨率的高:window.screen.height
屏幕分辨率的寬:window.screen.width
屏幕可用工作區高度:window.screen.availHeight
屏幕可用工作區寬度:window.screen.availWidth
offsetLeft:元素的左外邊框至包含元素的左內邊框之間的距離(書上)。經實際測試,其實為元素左外邊框至html左內邊框的距離
offsetTop:元素的上外邊框至包含元素的上內邊框之間的距離(書上)。經實際測試,其實為元素上外邊框至html上內邊框的距離。可能不同瀏覽器對其結果不同。
document.documentElement.clientHeight: 視口高度,混雜模式下用body代替documentElement
document.documentElement.scrollHeight:內容區高度
經實測:
獲取視口高度推薦使用:document.documentElement.clientHeight或者window.innerHeight
獲取文檔總高度推薦使用:document.documentElement.scrollHeight