DOM偏移

client系列

• clientWidth clientHeight (内边距+内容) (当前页面显示大小)
• clientTop clientLeft (边框)

scroll系列

• scrollHeight scrollWidth (整体高/宽)
• scrollTop scrollLeft (卷去高/宽)

offset系列

• offsetWidth offsetHeight (边框+内边距+内容)
• offsetTop offsetLeft (最近父参照物的距离)
• offsetParent (最近父参照物)

只有scrollLeft scrollTop可读写

案例

// 元素距离boby的偏移
// @params
//    element:查找的元素
// @return
//    object:{top:xxx,left:xxx}

function offset(ele) { 
  let parent = ele.offsetParent
  let l = ele.offsetLeft
  let t = ele.offsetTop
  while (parent && parent.tagName !== 'BODY') { 
    l += (parent.clientLeft + parent.offsetLeft)
    t += (parent.clientTop + parent.offsetTop)
    par = parent.offsetParent
  }
  return {top:t,left:l}
}