事件clientX、pageX、screenX、offsetX

clientX、clientY：点击位置距离当前body可视区域的x，y坐标
可以理解为距离浏览器窗口的距离，但注意这里不包括浏览器的导航栏距离只是浏览器内容区域。

pageX、pageY：对于整个页面来说，包括了被卷去的body部分的长度
相对于文档边缘,包含滚动条距离

screenX、screenY：点击位置距离当前电脑屏幕的x，y坐标

offsetX、offsetY：相对于带有定位的父盒子的x，y坐标

clientX：在水平方向上，鼠标指针距离浏览器左侧边缘的距离。（不包含滚动条）

pageX：在水平方向上，鼠标指针距离网页文档X轴左侧边缘的距离。（包含滚动条）

offsetX：在水平方向上，鼠标指针距离鼠标所在元素左侧边缘的距离。

screenX：在水平方向上，鼠标指针距离电脑屏幕左侧边缘的距离。

clientY：在垂直方向上，鼠标指针距离浏览器上面边缘的距离。（不包含滚动条）

pageY：在垂直方向上，鼠标指针距离网页文档Y轴上面边缘的距离。（包含滚动条）

offsetY：在垂直方向上，鼠标指针距离鼠标所在元素上面边缘的距离。

screenY：在垂直方向上，鼠标指针距离电脑屏幕上面边缘的距离。