Question

当您知道div名称时，很容易找到div的位置。但是当我所知道的是屏幕的X / Y线时，是否有一种简单的方法可以获得div id？

在名为#HarbourRadar的棋盘（另一个div）上名为'＃Items1'到'＃Items50'的div范围内不会有重叠的div。每个div #Items都可以包含多个堆叠图像。

无论如何，任何从某个位置找到div的提示都将非常感激。

下面的代码（取自下面的答案）得到了div #HarbourRadar的id，这是部分正确的，因为div #marker在那个上面分层，但是没有返回div #marker那个选择 - 即具有较高Z指数的一个。

var pos = $("#marker").position();
alert(document.elementFromPoint(pos.left, pos.top).id);

Answer 1

是的，可以使用document.elementFromPoint方法这就是Microsoft记录的方式。这是Mozilla documentation 该功能几乎完全兼容，您可以在this browser comparison中看到。

以下是来自MDN文档的一些示例代码：

function changeColor(newColor) {
  elem = document.elementFromPoint(2, 2);
  elem.style.color = newColor;
}

<p id="para1">Some text here</p>
<button onclick="changeColor('blue');">blue</button>
<button onclick="changeColor('red');">red</button>

Answer 2

查看现有的StackOverflow会话，您可能会发现这有助于：

Determine which element the mouse pointer is on top of in Javascript

这是使用javascript函数document.elementFromPoint，并有一个很棒的演示，显示了一个工作示例。

jsFiddle网址为：http://jsfiddle.net/MPTTp/

来自小提琴的代码：

$(window).click(function(e) {
    var x = e.clientX, y = e.clientY,
        elementMouseIsOver = document.elementFromPoint(x, y);

    alert(elementMouseIsOver);
});

有没有办法从位置（x，y线）找出div名称

2 个答案: