clientX、offsetX、screenX、pageX区别

开发中我们是离不开事件的，有关鼠标的事件就会牵扯到event对象，其中就包括了各种X、Y的值，区别他们最直接的就是看图。

示例

screenX、screenY

screenX 设置或获取获取鼠标指针位置相对于电脑屏幕的 x 坐标
screenY 设置或获取鼠标指针位置相对于电脑屏幕的 y 坐标

offsetX、offsetY

offsetX 设置或获取鼠标指针位置相对于触发事件的对象的 x 坐标
offsetY 设置或获取鼠标指针位置相对于触发事件的对象的 y 坐标

clientX、clientY

clientX 设置或获取鼠标指针位置相对于当前窗口的 x 坐标
clientY 设置或获取鼠标指针位置相对于当前窗口的 y 坐标

pageX、pageY

在图上看似pageX和screenX是一样的距离，其实不然，pageX指的是鼠标指针位置相对于整个页面的x坐标。其中就包括滚动条移动的距离。