Offset,Client,Scroll,Height,Top 一些距离参数的图示和解释

先上一张神图

按上右下左的顺序来：

1.clientTop,clientLeft

等于borderTop,borderLeft，就是border的宽度

2.ScrollTop,ScrollLeft

padding+border宽度+已滚动的高度/宽度

3.OffsetTop，OffsetLeft

offsetTop returns the distance of the current element relative to the top of the offsetParent node.

OffsetTop返回当前元素相对OffsetParent节点顶部的距离

offsetParent returns a reference to the object which is the closest (nearest in the containment hierarchy) positioned containing element. If the element is non-positioned, the nearest table cell or root element (html in standards compliant mode; body in quirks rendering mode) is the offsetParent. offsetParent returns null when the element has style.display set to "none". TheoffsetParent is useful because offsetTop and offsetLeft are relative to its padding edge.

OffsetParents返回一个离object最近的确定位置的包含元素的引用