Document: hasFocus()-Methode

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Die hasFocus()-Methode des Document-Interfaces gibt einen booleschen Wert zurück, der angibt, ob das Dokument oder ein beliebiges Element innerhalb des Dokuments den Fokus hat. Diese Methode kann verwendet werden, um festzustellen, ob das aktive Element in einem Dokument den Fokus hat.

Hinweis: Beim Betrachten eines Dokuments ist ein Element mit Fokus immer das aktive Element im Dokument, aber ein aktives Element hat nicht unbedingt den Fokus. Ein Beispiel hierfür ist ein aktives Element innerhalb eines Popup-Fensters, das nicht im Vordergrund ist und somit keinen Fokus hat.

Syntax

js
hasFocus()

Parameter

Keine.

Rückgabewert

false, wenn das aktive Element im Dokument keinen Fokus hat; true, wenn das aktive Element im Dokument den Fokus hat.

Beispiele

Das folgende Beispiel prüft, ob das Dokument Fokus hat oder nicht. Eine Funktion namens checkPageFocus() aktualisiert ein Absatz-Element abhängig vom Ergebnis von document.hasFocus(). Das Öffnen eines neuen Fensters führt dazu, dass das Dokument den Fokus verliert, und das Zurückwechseln zum ursprünglichen Fenster führt dazu, dass das Dokument den Fokus wiedererlangt.

HTML

html
<p id="log">Focus check results are shown here.</p>
<button id="newWindow">Open new window</button>

JavaScript

js
const body = document.querySelector("body");
const log = document.getElementById("log");

function checkDocumentFocus() {
  if (document.hasFocus()) {
    log.textContent = "This document has focus.";
    body.style.background = "white";
  } else {
    log.textContent = "This document does not have focus.";
    body.style.background = "gray";
  }
}

function openWindow() {
  window.open(
    "https://developer.mozilla.org/",
    "MDN",
    "width=640,height=320,left=150,top=150",
  );
}

document.getElementById("newWindow").addEventListener("click", openWindow);
setInterval(checkDocumentFocus, 300);

Ergebnis

Spezifikationen

Specification
HTML Standard
# dom-document-hasfocus-dev

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch