CaretPosition: offsetNode-Eigenschaft

Baseline 2025

Neu verfügbar

Seit Dezember 2025 funktioniert diese Funktion auf aktuellen Geräten und in aktuellen Browserversionen. Auf älteren Geräten oder in älteren Browsern funktioniert sie möglicherweise nicht.

Vollständige Kompatibilität anzeigen
Mehr erfahren

Die offsetNode-Eigenschaft des CaretPosition-Interfaces gibt ein Node zurück, das den gefundenen Knoten an der Position des Cursors enthält.

Wert

Ein Node.

Beispiele

Dieses Beispiel protokolliert offsetNode und offset der Cursor-Position, wenn innerhalb des Eingabefeldes geklickt wird.

html

<input aria-label="text field" value="Click inside this input field" />

<pre id="log"></pre>

input {
  width: 100%;
  padding: 10px;
  font-size: 16px;
  box-sizing: border-box;
}

#log {
  height: 200px;
  overflow: scroll;
  padding: 0.5rem;
  border: 1px solid black;
}

document.querySelector("input").addEventListener("click", (event) => {
  const x = event.clientX;
  const y = event.clientY;

  const caret = document.caretPositionFromPoint?.(x, y);
  if (!caret) {
    log("Not supported");
    return;
  }

  const node = caret.offsetNode;
  const offset = caret.offset;

  log(`offsetNode: ${node}`);
  log(`offset: ${offset}`);
});

const logElement = document.querySelector("#log");
function log(text) {
  logElement.innerText = `${logElement.innerText}${text}\n`;
  logElement.scrollTop = logElement.scrollHeight;
}

Spezifikationen

Spezifikation
CSSOM View Module # dom-caretposition-offsetnode

Browser-Kompatibilität

Siehe auch

Help improve MDN

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

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