② page client screen offset 区分汇总

一直分不清page client screen offset 就搜了下，发现都不是太完整，做了个汇总。仅供参考

document.querySelector("body").οnmοuseup=function(e){
  console.log(e.pageY)
  console.log(e.clientY)
  console.log(e.offsetY)
  console.log(e.screenY)
  this.scrollTop=0
}

pageY表示页面所有内容部位触发事件距离顶部的距离 包括滚动条滑动距离
clientY表示可看到的页面内容触发事件位置到顶部的距离，不包括滚动条的距离
offsetY表示相对于元素的相对距离
screenY表示触发事件位置 与整个浏览器顶部的距离包括页面顶部自带的高度，与clientY相似，只是 表示类似浮动层的距离

图解参考：

也可以参考文章：https://blog.csdn.net/weixin_42429672/article/details/91344555