Selection: empty() Methode

Baseline Weitgehend verfügbar

Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit August 2017 browserübergreifend verfügbar.

Die Selection.empty() Methode entfernt alle Bereiche aus der Auswahl, wodurch die Eigenschaften anchorNode und focusNode auf null gesetzt werden und nichts ausgewählt ist. Wenn diese Methode aufgerufen wird, wird ein selectionchange Ereignis im Dokument ausgelöst.

Hinweis: Diese Methode ist ein Alias für die Selection.removeAllRanges() Methode.

In diesem Artikel

Syntax

empty()

Parameter

Keine.

Rückgabewert

Keiner (undefined).

Beispiele

Dieses Beispiel zeigt eine Nachricht an, wenn etwas auf der Seite ausgewählt oder nicht ausgewählt wird. Es erreicht dies, indem es auf das selectionchange Ereignis im Dokument hört. Es gibt auch einen Knopf, der jegliche Auswahl löscht, indem er Selection.empty() aufruft. Wenn dies geschieht, wird die Auswahl geändert und die Nachricht wird aktualisiert.

html
<p>
  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse laoreet
  urna eget sapien venenatis, eget facilisis diam mattis.
</p>
<button>Clear selection</button>
<pre id="log"></pre>

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

// The selection object is a singleton associated with the document
const selection = document.getSelection();

// Logs if there is a selection or not
function newSelectionHandler() {
  if (selection.rangeCount !== 0) {
    log.textContent = "Some text is selected.";
  } else {
    log.textContent = "No selection on this document.";
  }
}

document.addEventListener("selectionchange", () => {
  newSelectionHandler();
});

newSelectionHandler();

// The button cancel all selection ranges
const button = document.querySelector("button");
button.addEventListener("click", () => {
  selection.empty();
});

Help improve MDN

War diese Übersetzung hilfreich?

Ja Nein

Erfahren Sie, wie Sie beitragen können Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden

Document Object Model (DOM)
Auswahl
Instanzeigenschaften
Instanzmethoden
Verwandte Seiten für DOM
Anleitungen
1. Anatomie des DOM
2. Attributreflexion
3. Auswahl und Traversierung im DOM-Baum
4. Erstellen und Aktualisieren des DOM-Baums
5. Arbeiten mit Ereignissen