易混淆的位置属性

clientWidth、clientLeft、offsetWidth、offsetLeft、screenX、scrollWidth、innerWidth、pageX

js

clientWidth = width + padding // 元素内部宽度
clientLeft = left + margin + border // 元素内部左边距

offsetWidth = width + padding + border + scrollbar
offsetLeft = left + margin // 元素左边框与定位父元素左边框的距离(偏移量)

screenX = left + margin + border + padding + width + scrollbar // 相对于显示器屏幕左上角的水平偏移量（并不是可视区）

e.pageX // 鼠标相对于文档的水平偏移量

getBoundingClientRect() // 返回盒模型信息及其相对于视口的位置