oDiv.clientWidth---》width+左右padding
oDiv.clientHeight---》height+上下padding
oDiv.clientTop---》上邊框的高度
oDiv.clientLeft---》左邊框的寬度
oDiv.offsetWidth---》clientWidth+左右邊框的寬度
oDiv.offsetHeight---》clientHeight+上下邊框的高度
offsetLeft---》當前元素距離父級參照物的左偏移量(從最外面的邊框開始算，也就是得到的值不包含我們的邊框的寬度)
offsetTop---》 當前元素距離父級參照物的上偏移量(從最外面的邊框開始算，也就是得到的值不包含我們的邊框的寬度)
console.log(oDiv.scrollWidth);
console.log(oDiv.scrollHeight);
1)在沒有內容溢出的情況下：
和我們的clientWidth/clientHeight值相等
2)在有內容溢出的情況下:
不管是否隱藏了溢出的內容(overflow: hidden)，我們的計算是這樣處理的:
scrollWidth 約等于 實際內容的真實寬度(被內容撐開后的寬度)+左padding
scrollHeight 約等于 實際內容的真實高(被內容撐開后的高度)+上padding
console.log(document.documentElement.scrollHeight||document.body.scrollHeight);
在真實項目中我們通常用scrollHeight獲取當前HTML頁面的總高度(不管有幾屏的內容我們都算上)
document.documentElement.clientHeight||document.body.clientHeight
只獲取當前瀏覽器一屏的高度
先寫document.documentElement在寫document.body，這樣就可以完全的兼容了
?
摘自“珠峰培訓"
