Obtener elemento en la posición especificada - JavaScript

133

Usando Javascript, ¿cómo puedo identificar el elemento en una posición determinada? Básicamente, estoy buscando escribir una función que tome dos parámetros de entrada (las coordenadas xey) y devuelva el elemento html en la posición en la pantalla representada por los parámetros.

javascript html dom kjv
fuente
3
elementsFromPoint
Janus Troelsen

Respuestas:

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

rahul
fuente
22
Si solo existiera document.elementsFromPointtambién, en caso de que los elementos se superpongan.
Seiyria
2
Estoy sorprendido de que esto funcionó, es decir, 5.5 y no se usa mucho hoy.
Vlad Nicula
He probado este método y mide la posición de acuerdo con el documento. ¿Cómo lo uso en relación con el elemento padre?
Charas
Si en la coordenada x, y, hay un marco o iframe, obtendrá el marco, en lugar del elemento en esa ubicación.
Elmue
13
document.elementsFromPointestá disponible en los últimos navegadores habilitados para Webkit y Gecko, aunque sea experimental. Ver MDN .
zopieux
27

Puede utilizar el elementFromPoint(x, y)método nativo de JavaScript , que devuelve el elemento en las coordenadas x, y en la ventana gráfica.

Ver el elemento elementFromPoint w3c draft

Y, una muestra de código:

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>
Expandir fragmento

Puede usar setInterval()para verificar continuamente el evento de desplazamiento del elemento, pero no se recomienda, intente usar .hover(...)y css para mejorar el rendimiento de la aplicación.

Andrés Morales
fuente