Получить элемент в указанной позиции - JavaScript

133

Как с помощью Javascript определить элемент в заданной позиции? В основном я хочу написать функцию, которая принимает два входных параметра (координаты x и y) и возвращает элемент html в позиции на экране, представленной параметрами.

javascript html dom

— KJV
источник

elementsFromPoint

— Янус Трельсен

Ответы:

241

document.elementFromPoint(x, y);

http://dev.w3.org/csswg/cssom-view/#dom-document-elementfrompoint

http://msdn.microsoft.com/en-us/library/ms536417%28VS.85%29.aspx

https://developer.mozilla.org/en/DOM/document.elementFromPoint

— Рахул
источник

Если бы тоже были document.elementsFromPoint- на случай, если элементы перекрываются.

— Seiyria

Я удивлен, что это работало, например, в 5.5, а сегодня не используется.

— Влад Никула

Я пробовал этот метод, и он измеряет положение в соответствии с документом. Как использовать его относительно родительского элемента?

— Charas

Если в координате x, y есть фрейм или iframe, вы получите фрейм, а не элемент в этом месте.

— Elmue

document.elementsFromPointдоступен в последних версиях браузеров с поддержкой Webkit и Gecko, хотя и является экспериментальным. См. MDN .

— zopieux 04

Вы можете использовать собственный elementFromPoint(x, y)метод JavaScript , который возвращает элемент с координатами x, y в области просмотра.

Смотрите elementFromPoint w3c draft

И пример кода:

function changeColor(newColor) {
    // Get the element placed at coords (2, 2)
    var elem = document.elementFromPoint(2, 2);
    // Set the foreground color to the element
    elem.style.color = newColor;
}

<p id="para1">Change this text color using the following buttons.</p>
<button onclick="changeColor('blue');">Blue</button>
<button onclick="changeColor('red');">Red</button>

Развернуть фрагмент

Вы можете использовать setInterval()для непрерывной проверки события зависания элемента, но это не рекомендуется, попробуйте .hover(...)вместо этого использовать и css для повышения производительности приложения.

— Андрес Моралес
источник