ShadowRoot: elementsFromPoint()-Methode
Nicht standardisiert: Diese Funktion ist nicht standardisiert. Wir raten davon ab, nicht-standardisierte Funktionen auf produktiven Webseiten zu verwenden, da sie nur von bestimmten Browsern unterstützt werden und sich in Zukunft ändern oder entfernt werden können. Unter Umständen kann sie jedoch eine geeignete Option sein, wenn es keine standardisierte Alternative gibt.
Die elementsFromPoint()-Methode des ShadowRoot-Interfaces gibt ein Array aller Shadow-Root-Elemente an den angegebenen Koordinaten (relativ zum Viewport) zurück. Die Elemente sind geordnet vom obersten Element (höchste in der Anzeige z-Ordnung) bis zum untersten Element.
Sie funktioniert ähnlich wie die ShadowRoot.elementFromPoint-Methode. Einige Browser geben nur die Shadow-Root-Elemente zurück, die an diesem Ort vorhanden sind. Andere Browser enthalten Elemente außerhalb des Shadow DOM, vom Shadow-DOM-Element in der obersten Schicht bis zum Dokument-Wurzelknoten, wie das <html>- oder das <svg>-Wurzelelement. In diesen Browsern funktioniert sie ähnlich wie die Document.elementsFromPoint-Methode, jedoch mit der Fähigkeit, die Schatten-Grenze zu überschreiten.
Syntax
elementsFromPoint(x, y)
Parameter
Rückgabewert
Ein Array von Element-Objekten.
Beispiele
const customElem = document.querySelector("my-custom-element");
const shadow = customElem.shadowRoot;
const elements = shadow.elementsFromPoint(20, 20);
const msg = elements.map((el) => el.localName).join(" < ");
if (msg) {
console.log(msg);
} else {
console.log("The custom element had no descendants at x: 20, y: 20.");
}
Wenn <my-custom-element> nahe der oberen linken Ecke des Viewports ist und ein einziges <div> enthält, kann das oben Genannte je nach Browser-Implementierung eines der folgenden zurückgeben:
div div < my-custom-element < body < html
Spezifikationen
Kein Teil eines Standards.