Bien que ce qui suit ne réponde pas réellement à la question, puisqu'il s'agit du premier résultat d'une recherche sur Google (le googleur peut ne pas poser exactement la même question :), j'espère que cela fournira des informations supplémentaires.
Il existe en fait deux approches différentes pour obtenir une liste de tous les éléments sur lesquels la souris se trouve actuellement (pour les navigateurs plus récents, peut-être):
L'approche "structurelle" - Arbre DOM ascendant
Comme dans la réponse de Dherman, on peut appeler
var elements = document.querySelectorAll(':hover');
Cependant, cela suppose que seuls les enfants superposeront leurs ancêtres, ce qui est généralement le cas, mais pas vrai en général, en particulier lorsqu'il s'agit de SVG où des éléments dans différentes branches de l'arborescence DOM peuvent se chevaucher.
L'approche «visuelle» - basée sur le chevauchement «visuel»
Cette méthode utilise document.elementFromPoint(x, y)
pour trouver l'élément le plus haut, le masquer temporairement (puisque nous le récupérons immédiatement dans le même contexte, le navigateur ne le rendra pas réellement), puis continuez pour trouver le deuxième élément le plus haut ... Ça a l'air un peu hacky, mais il renvoie ce que vous attendez quand il y a, par exemple, des éléments frères dans un arbre qui s'occluent les uns les autres. Veuillez trouver cet article pour plus de détails,
function allElementsFromPoint(x, y) {
var element, elements = [];
var old_visibility = [];
while (true) {
element = document.elementFromPoint(x, y);
if (!element || element === document.documentElement) {
break;
}
elements.push(element);
old_visibility.push(element.style.visibility);
element.style.visibility = 'hidden'; // Temporarily hide the element (without changing the layout)
}
for (var k = 0; k < elements.length; k++) {
elements[k].style.visibility = old_visibility[k];
}
elements.reverse();
return elements;
}
Essayez les deux et vérifiez leurs différents retours.