博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
一张图轻松搞懂javascript event对象的clientX,offsetX,screenX,pageX区别
阅读量:6698 次
发布时间:2019-06-25

本文共 577 字,大约阅读时间需要 1 分钟。

当然是clone的,在高级编程上看见了screenX和screenY,但是webstrom是带灰色浪线,所以百度一下,发现了这个就收了


 

总是会被javascript的event对象的clientX,offsetX,screenX,pageX 弄得头晕,于是决定做个图来区分一下(画得我手那个酸呀。。。。)

 

先总结下区别:

event.clientX、event.clientY

鼠标相对于窗口可视区域的X,Y坐标(窗口坐标),可视区域不包括工具栏和滚动条。IE事件和标准事件都定义了这2个属性

event.pageX、event.pageY

类似于event.clientX、event.clientY,但它们使用的是文档坐标而非窗口坐标。这2个属性不是标准属性,但得到了广泛支持。IE事件中没有这2个属性。

event.offsetX、event.offsetY

鼠标相对于事件源元素(srcElement)的X,Y坐标,只有IE事件有这2个属性,标准事件没有对应的属性。

event.screenX、event.screenY

鼠标相对于用户显示器屏幕左上角的X,Y坐标。标准事件和IE事件都定义了这2个属性

 

上图!!!!

 

转载于:https://www.cnblogs.com/bengbengbengbengbeng/p/7205750.html

你可能感兴趣的文章
打包文件 MANIFEST.MF 功能详解
查看>>
构建vue单页应用(一)
查看>>
最小公倍数
查看>>
HDOJ_ACM_Can you find it?
查看>>
SpringMVC-常用的注解
查看>>
羊车门问题
查看>>
用substr()截取中文出现乱码的解决方法
查看>>
Java练习 SDUT-2400_高中数学?
查看>>
UGUI组件之InputField 组件简单笔记(输入栏 输入框 )
查看>>
java-随学随记之基础篇
查看>>
Linux 统计文件夹,文件数量的命令
查看>>
spring hibernate实现动态替换表名(分表)
查看>>
精通ArrayList,关于ArrayList你想知道的一切
查看>>
KeyStore和TrustStore
查看>>
iOS - WKWebView加载不受信任的https (因用到IP地址加端口号去请求数据)
查看>>
vs和vim
查看>>
基于socket套接字发送大文件示例
查看>>
hdu1247 Hat’s Words
查看>>
Druid 介绍及配置
查看>>
Daily Scrum- 12/23
查看>>