pagex,pagex和docx
clientX、offsetX、pageX、screenX的异同相信很多刚就此问题学习DOM事件的小伙伴可能都很无知，我先从文字上解释一下它的异同
首先，明确对浏览器来说，x和y的左侧是如何计算的。
x坐标以浏览器的视觉窗口的左上角为坐标原点，右手为x的正坐标，左手为负坐标。
同样地，对于y坐标，将浏览器的视觉窗口的左上角设定为坐标的原点，其中下为y的正坐标，上为y的负坐标。
但是，浏览器的可视窗口中不存在负坐标，因为最小值为0，0
一：clientX:
clientX是针对浏览器窗口计算的。 无论是否有滚动条，可显示的窗口有多大？ 例如，如果您可以将浏览器宽度设置为4000PX，但只有100PX的窗口可显示，则clientX的最大值为100PX
二：offsetX
offsetX指示对于绑定事件的元素，其水平坐标距离绑定元素内部边界的距离和水平坐标的距离。 例如，如果将与单击对应的函数绑定到div，然后用鼠标单击div框，则浏览器会检索鼠标距离此div框内的边界有多远。 offsetX是多久 三：pageX pageX也是为浏览器窗口计算的，与clientX的性质基本一致，但最大的不同在于将浏览器宽度设置为4000PX时，pageX获得的最大x值也为4000PX 四：screenX screenX对于我们用户的显示分辨率，比如显示分辨率为1920X1200，你的screenX和screenY的最大值为1920px和1200px 以chrome浏览器为测试案例，显示屏分辨率为1920 X 1200 点击箱子的话 pageX和clientX的坐标相同，但发现offsetX比它们少8。 这是因为没有删除页面的padding和margin值。 如果删除，这三个值将相同。 但是，前提是将绑定事件的div框放置在浏览器的左上角。 将zldmj-leler添加到div框时，如果单击了div框中的同一单击点，则x的offset坐标仍为91，但offsetX和clientX为99 100-8，screenX为194 100。 对于screenX，浏览器的“padding”和“margin”值不会产生影响，因为它们以显示器分辨率为参考点。 虽然还有未展示的部分，但感兴趣的人可以根据我上面的文字部分进行演示。 如果有什么不对的地方或者需要补充的，我欢迎指出我的错误来补充。 谢谢你。