html5获取鼠标坐标,【JS】怎么获取鼠标当前位置下的DOM元素,或者判断当前位置有没有元素。...

怎么获取鼠标当前位置下的DOM元素的ID,或者判断当前位置有没有DOM元素?

鼠标是有图片跟随的,是用onmousemove方法写的,不知道会不会影响获取鼠标当前位置的DOM元素。

想过用碰撞的方法来实现,不过页面中DOM元素太多,碰撞的话只能一对一。跟随鼠标移动的图片占一个。那么剩下来的DOM元素怎么装入第二个位置,用数组吗…….不会,或者算法。。求指点。

回答

当前位置当然一定会有 DOM 元素啦,至少 body 和 document 元素是充满整个窗体空间的啊。哦,也可能你把 mousemove 绑定在 window 上,mousedown 时鼠标移出窗口也是会触发 mousemove 的,这个倒是要注意一样。

关键 API: document.elementFromPoint

var element = document.elementFromPoint(x, y);

嗯,你给一个 x,y 坐标,这个 API 就给你返回该点最上层的 DOM 元素。Caniuse.com 上显示这个 API 可是兼容到 IE6 呢!这么好用的 API 居然鲜有人知。elementFromPoint 兼容性

貌似鼠标跟随的元素就在最上层?没关系,给这个图片设置 css point-events: none,让它对鼠标形同虚设,这样 document.elementFromPoint 就能返回你要的 DOM 啦。

给document绑定onmousemove事件,然后用event.currentTarget判断?

嗯…没了解过这样的需求

只知道有个document.elementFromPoint()和document.elementsFromPoint()的API(注意区别是element后边有没有s),但是并没用过……所以不知道兼容怎样。可以参考MDN – elementsFromPoint以及javascript标准参考教程 – document 对象~

类似冷门的API不止这一个,比如可以参考jjc的你可能不知道的前端知识点

用事件委托应该可以实现。具体就是让父元素监听onmoseenter或者其他事件,当子元素触发时父元素判断就可以了。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值