針對(duì)某一個(gè)元素的寬高
一、clientWidth和clientHeigh、clientTop和clientLeft
1. clientWidth的實(shí)際寬度
clientWidth = width+左右padding
2. clientHeigh的實(shí)際高度
clientHeigh = height + 上下padding
3. clientTop的實(shí)際寬度
clientTop = boder.top(上邊框的寬度)
4. clientLeft的實(shí)際寬度
clientLeft = boder.left(左邊框的寬度)
二、offsetWidth和offsetHight 、 offsetTop和offsetLeft
1. offsetWidth的實(shí)際寬度
offsetWidth = width + 左右padding + 左右boder
2. offsetHeith的實(shí)際高度
offsetHeith = height + 上下padding + 上下boder
3. offsetTop實(shí)際寬度
offsetTop：當(dāng)前元素 上邊框 外邊緣 到 最近的已定位父級(jí)（offsetParent） 上邊框 內(nèi)邊緣的 距離。如果父級(jí)都沒(méi)有定位，則分別是到body 頂部 和左邊的距離
4. offsetLeft實(shí)際寬度
offsetLeft：當(dāng)前元素 左邊框 外邊緣 到 最近的已定位父級(jí)（offsetParent） 左邊框 內(nèi)邊緣的距離。如果父級(jí)都沒(méi)有定位，則分別是到body 頂部 和左邊的距離
三、scrollWidth和scrollHeight 、 scrollTop和scrollLeft
1. scrollWidth實(shí)際寬度
scrollWidth：獲取指定標(biāo)簽內(nèi)容層的真實(shí)寬度（可視區(qū)域?qū)挾?被隱藏區(qū)域?qū)挾龋?br>
2. scrollHeight的實(shí)際高度
scrollHeight：獲取指定標(biāo)簽內(nèi)容層的真實(shí)高度（可視區(qū)域高度+被隱藏區(qū)域高度）
3. scrollTop
scrollTop :內(nèi)容層頂部 到 可視區(qū)域頂部的距離
4. scrollLeft
scrollLeft:內(nèi)容層左端 到 可視區(qū)域左端的距離
針對(duì)瀏覽器的寬高
一、Javascript
document.body.clientWidth //網(wǎng)頁(yè)可見(jiàn)區(qū)域?qū)?body)
document.body.clientHeight //網(wǎng)頁(yè)可見(jiàn)區(qū)域高(body)
document.body.offsetWidth //網(wǎng)頁(yè)可見(jiàn)區(qū)域?qū)?body)，包括border、margin等
document.body.offsetHeight //網(wǎng)頁(yè)可見(jiàn)區(qū)域?qū)?body)，包括border、margin等
document.body.scrollWidth //網(wǎng)頁(yè)正文全文寬，包括有滾動(dòng)條時(shí)的未見(jiàn)區(qū)域
document.body.scrollHeight //網(wǎng)頁(yè)正文全文高，包括有滾動(dòng)條時(shí)的未見(jiàn)區(qū)域
document.body.scrollTop //網(wǎng)頁(yè)被卷去的Top(滾動(dòng)條)
document.body.scrollLeft //網(wǎng)頁(yè)被卷去的Left(滾動(dòng)條)
window.screenTop //瀏覽器距離Top
window.screenLeft //瀏覽器距離Left
window.screen.height //屏幕分辨率的高
window.screen.width //屏幕分辨率的寬
window.screen.availHeight //屏幕可用工作區(qū)的高
window.screen.availWidth //屏幕可用工作區(qū)的寬
二、Jquery
$(window).height() //瀏覽器當(dāng)前窗口可視區(qū)域高度
$(document).height() //瀏覽器當(dāng)前窗口文檔的高度
$(document.body).height() //瀏覽器當(dāng)前窗口文檔body的高度
$(document.body).outerHeight(true) //瀏覽器當(dāng)前窗口文檔body的總高度 包括border padding margin
$(window).width() //瀏覽器當(dāng)前窗口可視區(qū)域?qū)挾?br>
$(document).width() //瀏覽器當(dāng)前窗口文檔對(duì)象寬度
$(document.body).width() //瀏覽器當(dāng)前窗口文檔body的寬度
$(document.body).outerWidth(true) //瀏覽器當(dāng)前窗口文檔body的總寬度 包括border padding margin
js得到屏幕寬高，頁(yè)面寬高
window.screen.availWidth 返回當(dāng)前屏幕寬度(空白空間)
window.screen.availHeight 返回當(dāng)前屏幕高度(空白空間)
window.screen.width 返回當(dāng)前屏幕寬度(分辨率值)
window.screen.height 返回當(dāng)前屏幕高度(分辨率值)
window.document.body.offsetHeight; 返回當(dāng)前網(wǎng)頁(yè)高度
window.document.body.offsetWidth; 返回當(dāng)前網(wǎng)頁(yè)寬度
