JavaScript中offset、scroll、client三大系列

一、offset系列

offset有五个属性分别是：

offsetWidth：获取元素的宽。
offsetHeight: 获取元素的高.
offsetHeight = height + padding + border

语法:document.getElementById('div').offsetWidth（因为document.getElementById('div').style.width只能获取行内样式,而嵌入式里的样式就需要offsetWidth）。 

offsetLeft获取元素到父级元素的左边距
offsetTop获取元素到父级元素的上边距

1，到距离自身最近的（带有定位的）父元素的 左侧/顶部
2，如果所有父级元素都没有定位，则以body为准
3，offsetLeft是自身border左侧到父级padding左侧的距离

offsetParent 返回该对象距离最近的带有定位的父级元素,如果当前元素的所有父级元素都没有定位（position为absolute或relative），那么offsetParent为body

二、scroll系列

scrollWidth: 获取元素实际内容的宽度，如果内容没有沾满元素的一行，获取的是元素的宽度(包括padding,不加边框)
scrollHeight:获取元素实际内容的高
scrollTop:卷曲上去的值
scrollleft:向左卷曲出去的值

三、client系列

clientWidth:可视区域的宽(不包含边框),边框内部的宽度
clientHeight:可视区域的高(不包含边框),边框内部的高度
clientLeft:左边边框的宽度
clientTop :上面的边框的高度