UIEvent.view — Eigenschaft · JavaScript-Referenz

Signatur

UIEvent.view

Beschreibung

UIEvent.view verweist auf das Fenster (genauer: den WindowProxy), in dem ein Benutzeroberflächen-Ereignis entstanden ist. Die Eigenschaft steht bei allen von UIEvent abgeleiteten Ereignissen zur Verfügung, etwa MouseEvent, KeyboardEvent, FocusEvent, InputEvent, PointerEvent, TouchEvent und WheelEvent.

Praktisch ist view vor allem dann, wenn ein einzelner Handler Ereignisse aus mehreren Browsing-Kontexten verarbeitet, also aus dem Hauptdokument und aus gleich-originigen <iframe>-Elementen oder Pop-up-Fenstern. Über event.view erreicht man dann das richtige window, zum Beispiel um getComputedStyle(), getSelection() oder Scroll-Positionen des passenden Fensters abzufragen.

Bei echten, vom Browser ausgelösten Ereignissen ist view in der Regel das Fenster des Dokuments. Wird ein Ereignis per Skript mit new MouseEvent() o. Ä. erzeugt, ist view standardmäßig null, außer man übergibt im Initialisierungsobjekt ausdrücklich view: window.

Rückgabewert

Typ

WindowProxy | null

Beschreibung

Das Fenster, in dem das Ereignis entstanden ist, oder null, wenn keines angegeben wurde (z. B. bei synthetischen Ereignissen ohne view-Option).

Beispiele

Fenster eines Klick-Ereignisses ermitteln

document.addEventListener('click', (event) => {
  console.log(event.view === window);
  console.log(event.view.innerWidth > 0);
});

true true

Ereignisse aus einem gleich-originigen iframe unterscheiden

const frame = document.querySelector('iframe');

const handleKey = (event) => {
  const quelle = event.view === window ? 'Hauptfenster' : 'iframe';
  // Auswahl im jeweils richtigen Fenster lesen
  const auswahl = event.view?.getSelection()?.toString() ?? '';
  console.log(`${quelle}: Taste ${event.key}, Auswahl: "${auswahl}"`);
};

document.addEventListener('keydown', handleKey);
frame.addEventListener('load', () => {
  frame.contentDocument.addEventListener('keydown', handleKey);
});

iframe: Taste a, Auswahl: ""

Synthetisches Ereignis mit und ohne view

const ohneView = new MouseEvent('click');
const mitView = new MouseEvent('click', { view: window, bubbles: true });

console.log(ohneView.view);
console.log(mitView.view === window);

null true

// Wichtig · Fallstricke

Schreibgeschützt: Eine Zuweisung an event.view wird stillschweigend ignoriert (im Strict Mode gibt es einen TypeError). Den Wert legt man nur über die view-Option im Konstruktor fest.
Synthetische Ereignisse: Ohne view-Option ist der Wert null. Code, der sich auf event.view verlässt, sollte deshalb optionales Verketten (event.view?.…) nutzen.
Die view-Option muss ein Window oder null sein, sonst wirft der Konstruktor einen TypeError.
Fremde Ursprünge: Kommt das Fenster von einem anderen Ursprung, kann man über den WindowProxy nur auf wenige Eigenschaften zugreifen (z. B. postMessage). Alles andere löst einen SecurityError aus.
Einfache Event-Objekte (z. B. load, change) sind keine UIEvents und haben keine view-Eigenschaft.
Die Eigenschaft wird von allen modernen Browsern unterstützt. Die veraltete Methode initUIEvent() sollte man nicht mehr verwenden.

Siehe auch

Window Event.target ErrorEvent.lineno UIEvent.which UIEvent.detail