element.clientHeight 元素可見高度
element.clientWidth 元素可見寬度
element.offsetHeight 元素高度
element.offsetWidth 元素寬度
element.offsetLeft 元素水平偏移位置
element.offsetTop 元素垂直偏移位置
element.offsetParent 元素偏移的容器
element.scrollHeight 元素的整體高度
element.scrollWidth 元素的整體寬度
element.scrollLeft 元素左邊緣與視圖之間的距離
element.scrollTop 元素上邊緣與視圖之間的距離
clientHeight、clientWidth
包括padding，不包含滾動(dòng)條、border、margin
image.png
offsetHeight、offsetWidth
包括padding、border、水平滾動(dòng)條，不包含margin
image.png
scrollHeight、scrollWidth
子元素大于父元素，出現(xiàn)滾動(dòng)：
當(dāng)有滾動(dòng)條時(shí)：scrollHeight>=clientHeight；
沒有滾動(dòng)條時(shí)：scrollHeight==clientHeight
image.png
scrollTop、scrollLeft
當(dāng)有滾動(dòng)條時(shí)，滾動(dòng)條向下滾動(dòng)的距離即元素頂部被遮住的高度
image.png
offsetTop、offsetLeft
元素距離最近父元素的距離，和滾動(dòng)條無關(guān)
image.png
參考文檔：
https://www.w3school.com.cn/jsref/dom_obj_all.asp
https://blog.csdn.net/qq_35430000/article/details/80277587
