offset系列、scroll系列和client系列

offset系列：
由于在style标签中设置的样式属性获取不到，style属性中设置的样式属性是可以获取到的，因此有时候需要借助offset系列来获取某些样式。

• offsetWidth：获取元素的宽(包括边框）
• offsetHeight：获取元素的高
• offsetLeft：获取元素距离左边位置的值
• offsetTop：获取元素距离上面位置的值
  其中offsetLeft、 offsetTop没有脱离文档流的话，其值为父级元素margin+父级元素padding+父级元素的border+自己的margin；脱离文档流，其值为自己的left和自己的margin
  scroll系列：卷曲
• scrollWidth:元素中内容的实际的宽(没有边框),如果没有内容就是元素的宽
• scrollHeight:元素中内容的实际的高(没有边框),如果没有内容就是元素的高
• scrollLeft：向左卷曲出去的距离
• scrollTop：向上卷曲出去的距离
• 封装卷曲函数：

  function getScroll() {
    return {
      left: window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft||0,
      top: window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0
    };
  }

client系列：可视区域

• clientWidth:可视区域的宽(没有边框),边框内部的宽度
• clientHeight:可视区域的高(没有边框),边框内部的高度
• clientLeft:左边边框的宽度
• clientTop :上面的边框的宽度