js三大家族

JS三大家族

offset家族
作用：获取元素真实的宽高和位置
其中有：offsetWidth 、offsetHeight 、offsetLeft和offsetTop以及offsetParent

offsetLeft和offsetTop：检测距离父盒子有定位的左/上面的距离

offsetWidth 、offsetHeight：检测盒子自身宽高

offsetParent：检测父系盒子中带有定位的父盒子节点

Scroll家族
家族成员：scrollWidth scrollHeight scrolLeft scrollTop
作用：scrollWidth scrollHeight：获取元素内容的真实宽高（IE8）
scrolLeft scrollTop ：获取元素内容真实得到位置

其中要考虑到兼容性的问题：
window.pageXOffset , window.pageYOffset ： 谷歌 火狐浏览器
document.documentElement.scrollLeft, document.documentElement.scrollTop：IE浏览器

document.body.scrollLeft, document.body.scrollTop： 则是其他浏览器

client家族
作用：获取页面可视区域
clientWidth 获取网页可视区域宽度
clientHeight 获取网页可视区域高度
clientTop和clientLeft 实际获取到的是左边框和上边框