HTMLButtonElement: interestForElement-Eigenschaft
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.
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 interestForElement-Eigenschaft des HTMLButtonElement-Interfaces ruft das Zielelement eines "interest invoker" ab oder legt es fest, falls das zugehörige <button>-Element als "interest invoker" angegeben wurde.
Siehe Erstellen eines Interest Invokers für weitere Details.
Wert
Eine Instanz des Element-Objekts oder null, wenn das zugehörige <button>-Element kein Zielelement gesetzt hat.
Beispiele
Grundlegende Nutzung von interestForElement
In diesem Beispiel nutzen wir die interestForElement-Eigenschaft eines <button>-Elements, um sein Zielelement festzulegen, und rufen anschließend das tagName des Zielelements ab. Das tagName wird dann im Textinhalt des <button>-Elements ausgegeben.
HTML
Wir fügen ein <button>-Element und ein <div>-Element ein. Wir verwandeln das <div>-Element in ein Popover, indem wir ihm ein popover-Attribut zuweisen.
<button href="#">a button</button>
<div id="mypopover" popover>I am a <code><div></code> element.</div>
JavaScript
Wir erhalten Referenzen zu den <button>- und <div>-Elementen im Skript und deklarieren dann eine "interest invoker"-Ziel-Beziehung zwischen dem <button> und dem <div>, indem wir die interestForElement-Eigenschaft des <button>-Elements auf eine Referenz zum <div> setzen. Anschließend setzen wir den Textinhalt des Buttons auf einen String, der das tagName des Zielelements enthält, abgerufen über invoker.interestForElement.tagName.
const invoker = document.querySelector("button");
const popover = document.querySelector("div");
invoker.interestForElement = popover;
invoker.textContent = `My target is a ${invoker.interestForElement.tagName} element`;
Ergebnis
Das Beispiel wird wie folgt gerendert:
Versuchen Sie, Interesse am Button zu zeigen (zum Beispiel, indem Sie ihn fokussieren oder darüber schweben), um das <div> erscheinen zu lassen.