elementFromPoint的用法（详解）

62 阅读 0 评论 41 点赞

我是靠谱客的博主爱撒娇火龙果，最近开发中收集的这篇文章主要介绍elementFromPoint的用法（详解），觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

document.ElementFromPoint:根据坐标获得元素，可用于触屏设备上获取当前点击元素的名称

语法：
oElement = document . elementFromPoint ( iX , iY )
参数：
iX :　必选项。整数(Integer)。单位：象素(Pixel)。定位横坐标偏移量。
iY :　必选项。整数(Integer)。单位：象素(Pixel)。定位纵坐标偏移量。

返回值：
oElement :　对象(Element)。返回获取的对象的引用。

说明：
根据横纵坐标值 iX 和 iY 获取对象 oElement 。 oElement 必须支持和响应鼠标事件。
提供的坐标是客户区坐标。客户区的左上角为 (0,0)。
当将此方法用于 Structured Graphics 或 Sprite 对象时，必须设置 MouseEventsEnabled 属性值为 1 。

<script>
function rdl_eventHandle(e){
event.cancelBubble=true;
var oPoint=document.elementFromPoint(event.clientX,event.clientY);
if (oPoint.tagName.toLowerCase()!="li") oCode.innerHTML="请将鼠标移动到项目列表上。";
else oCode.innerHTML="您的鼠标指针现在位于<font color='#FF3300'>"+oPoint.innerText+"</font>上面";
}
document.οnmοuseοver=rdl_eventHandle;
</script>
<ul id=oList style="cursor:default;">
<li>列表项目1
<li>列表项目2
<li>列表项目3
<li>列表项目4
</ul>
<br><div id=oCode>请将鼠标移动到项目列表上。</div>