1、offset 偏移
1、offsetWidth 和 offsetHeight 是用來得到對象的大小，由自身寬高 內邊距 邊框構成但是不包括 外邊距
- offsetHeight和style.height的區別
1> style.height只能獲取行內樣式，offsetHeight可以獲取行內樣式和內嵌樣式
2> style.height是字符串（而且帶單位），offsetHeight是數值
3> style.height可讀可寫，offsetHeight是只讀屬性
2、offsetLeft 和 offsetTop 用來得到對象的位置，到距離自身最近的（帶有定位的）父元素的左側/頂部 的距離，如果所有父級都沒有定位則以body 為準
-
offsetLeft和style.left的區別
1> style.left只能獲取行內樣式，offsetLeft 可以獲取行內樣式和內嵌樣式
2> offsetLeft 只讀，style.left可讀可寫
3> offsetLeft是數值，style.left是字符串并且有單位px
4> 如果沒有加定位，style.left獲取的數值可能是無效的
5> 最大區別在于offsetLeft以border左上角為基準，style.left以margin左上角為基準
image.png
2、scroll 滾動
1、scrollHeight和scrollWidth 對象內部實際內容的高度/寬度，包括內容區和內邊距，不包括邊框
2、scrollTop和scrollLeft 被卷去部分的 頂部/左側 到可視區域 頂部/左側 的距離
image.png
3、client 可視區、客戶端
1、clientWidth和clientHeight 包括內容區和內邊距，不包括邊框
2、clientTop和clientLeft 幾乎不用，因為滾動條不會在頂部和左側
image.png
2017.11.7
