offsetLeft,clientX ,offsetX 定義和區別

關於元素大小位置等信息的一些屬性。有：

clientLeft和clientTop

clientWidth和clientHeight

offsetLeft和offsetTop

offsetParent

offsetWidth和offsetHeight

scrollLeft和scrollTop

scrollWidth和scrollHeight

 

clientLeft,clientTop:表示內容區域的左上角相對於整個元素左上角的位置（包括邊框）。(取決於邊框的像數值？)

clientWidth,clientHeight:內容區域的寬高，不包括邊框寬度值。

offsetLeft,offsetTop:相對於最近的祖先定位元素。

offsetParent:某元素的父元素 例如：this.offsetParent.tagName.toLowerCase() 得到body...

offsetWidth,offsetHeight 整個元素的尺寸(不包括變寬的寬度)

scrollLeft,scrollTop:元素滾動的大小

scrollWidth,scrollHeight:整個內容區域的寬度(包括需拉動滾動條隱藏起來的那些部分) scrollTop+clientWidth

 

 

 

scrollWidth:獲取對象的滾動寬度

scrollHeight: 獲取對象的滾動高度。

scrollLeft:設置或獲取位於對象左邊界和窗口中目前可見內容的最左端之間的距離

scrollTop:設置或獲取位於對象最頂端和窗口中可見內容的最頂端之間的距離

offsetLeft:獲取對象相對於版面或由 offsetParent 屬性指定的父坐標的計算左側位置

offsetTop:獲取對象相對於版面或由 offsetTop 屬性指定的父坐標的計算頂端位置

event.clientX 相對文檔的水平座標

event.clientY 相對文檔的垂直座標

event.offsetX 相對容器的水平坐標

event.offsetY 相對容器的垂直坐標

 

scrollHeight： 對象的滾動高度（滾動條的高度，可滾動的高度）

scrollWidth： 對象的滾動寬度（同上）

scrollLeft： 對象左邊界和窗口中目前可見內容的左端之間的距離（滾動條已滾動的距離）

scrollTop： 對象最頂端和窗口中可見內容的最頂端之間的距離（同上）

offsetHeight： 對象相對於版面或offsetParent 的高度（可見部分的寬度加上滾動條實體的寬度）

offsetWidth： 對象相對於版面或offsetParent 的寬度

offsetLeft： 對象相對於版面或由 offsetParent 左側位置

offsetTop：對象相對於版面或由 offsetTop 頂端位置

clientX： 相對文檔的水平坐標

clientY： 相對文檔的垂直坐標

clientWidth：相對文檔的寬度（可見部分的寬度）

clientHeight：相對文檔的高度

event.offsetX： 相對容器的水平坐標

event.offsetY ： 相對容器的垂直坐標