XPathResult.snapshotItem() — Methode · JavaScript-Referenz

Signatur

XPathResult.prototype.snapshotItem(index)

Beschreibung

Mit snapshotItem() greifen Sie gezielt über einen Index auf einzelne Knoten eines Snapshot-Ergebnisses zu. Ein solches Ergebnis erhalten Sie, wenn Sie document.evaluate() mit dem Ergebnistyp XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE (6) oder XPathResult.ORDERED_NODE_SNAPSHOT_TYPE (7) aufrufen.

Anders als bei Iterator-Ergebnissen (iterateNext()) ist ein Snapshot eine statische Momentaufnahme: Wird das DOM nach der Auswertung verändert, bleibt die Knotenliste unverändert und wird nicht ungültig. Deshalb eignen sich Snapshots besonders, wenn Sie gefundene Knoten in einer Schleife verändern, verschieben oder entfernen wollen.

Die Anzahl der Knoten liefert snapshotLength. Gültige Indizes reichen von 0 bis snapshotLength - 1; für alle anderen Werte wird null zurückgegeben.

Parameter

Name	Typ	Default	Beschreibung
$index Pflicht	number		Nullbasierter Index des gewünschten Knotens im Snapshot. Der Wert wird in eine vorzeichenlose 32-Bit-Ganzzahl umgewandelt.

Rückgabewert

Typ

Node | null

Beschreibung

Der Knoten an der angegebenen Position oder null, wenn index größer oder gleich snapshotLength ist.

Beispiele

Alle Überschriften per Index auslesen

// HTML: <h2>Einleitung</h2><h2>Installation</h2><h2>Nutzung</h2>
const result = document.evaluate(
  '//h2',
  document,
  null,
  XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,
  null
);

for (let i = 0; i < result.snapshotLength; i++) {
  const heading = result.snapshotItem(i);
  console.log(`${i + 1}. ${heading.textContent}`);
}

1. Einleitung 2. Installation 3. Nutzung

Gefundene Knoten sicher aus dem DOM entfernen

// Alle leeren Absätze löschen – dank Snapshot kein Problem mit DOM-Änderungen
const emptyParagraphs = document.evaluate(
  '//p[not(normalize-space())]',
  document,
  null,
  XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE,
  null
);

for (let i = 0; i < emptyParagraphs.snapshotLength; i++) {
  emptyParagraphs.snapshotItem(i).remove();
}

console.log(`${emptyParagraphs.snapshotLength} leere Absätze entfernt`);

3 leere Absätze entfernt

Snapshot in ein Array umwandeln

const snapshotToArray = (xpath, context = document) => {
  const res = document.evaluate(
    xpath, context, null,
    XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null
  );
  return Array.from({ length: res.snapshotLength }, (_, i) => res.snapshotItem(i));
};

const links = snapshotToArray('//a[@href]');
console.log(links.map((a) => a.href));

// Index außerhalb des Bereichs
const res = document.evaluate('//a', document, null, 7, null);
console.log(res.snapshotItem(9999));

["https://example.com/", "https://example.com/kontakt"] null

// Wichtig · Fallstricke

Falscher Ergebnistyp: Ist resultType nicht UNORDERED_NODE_SNAPSHOT_TYPE oder ORDERED_NODE_SNAPSHOT_TYPE, wirft snapshotItem() einen TypeError (ältere Spezifikationen: XPathException mit TYPE_ERR).
Statische Daten: Der Snapshot spiegelt spätere DOM-Änderungen nicht wider. Entfernte Knoten bleiben im Snapshot enthalten, auch wenn sie nicht mehr im Dokument hängen.
Reihenfolge: Nur bei ORDERED_NODE_SNAPSHOT_TYPE ist die Dokumentreihenfolge garantiert; bei UNORDERED ist sie implementierungsabhängig (in der Praxis meist trotzdem geordnet).
Negative Indizes werden in große vorzeichenlose Zahlen umgewandelt und liefern daher null – es gibt keinen Zugriff vom Ende her wie bei Array.prototype.at().
Kompatibilität: In allen modernen Browsern verfügbar; in Node.js nur über DOM-Implementierungen wie jsdom.

Siehe auch

XPathResult XPathResult.snapshotLength XPathResult.iterateNext() Document.evaluate() XPathEvaluator XPathResult.resultType SpeechRecognitionResultList.item()