offset家族

 offsetWidth 得到对象自己的宽度(得到的值不包含单位)   offsetWidth=width+padding+border

例如 div{ width：200px;border-left:2px solid red; padding:10px;}
div = document.getElementById("div");
div.offsetWidth=200+2+10*2=222

同理offsetHeight

offsetLeft 返回距离上级盒子（最近带有定位的的盒子）左边的位置。如果父级都没有定位，则以body为准。
这里的父级从padding开始算 border不算。即，指子盒子到定位父盒子边框到边框的距离。

同理offsetTop

offsetParent
返回改对象的父级（带有定位）不一定是亲的爸爸
如果当前元素的父级元素没有进行CSS定位（position为absolute或relative），offsetParent为body
var son = document.getElementById("son");
//alert(son.parentNode.id);
alert(son.offsetParent.tagName); // tagName标签的名

offsetTop 和 style.top 的区别（同理offsetLeft 和 style.left）
最大的区别在于，offsetTop 可以返回没有定位盒子的距离上部的位置。而style.top 不可以，只有定位的盒子才有top、left、right、bottom
区别2 offsetTop 返回的是数字，而style.top返回说的是字符串，除了数字外还有单位：px
区别3 offsetTop 为只读，而style.top可读可写
区别4 如果没有给html 元素指定通过top样式，则style.top返回的是空字符串。
区别5 style.top 只能得到行内样式，offsetTop随便。