HTMLSlotElement: assignedNodes() Methode
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.
Die assignedNodes()
Methode des HTMLSlotElement
Interfaces gibt eine Sequenz der Knoten zurück, die diesem Slot zugewiesen sind.
Wenn die flatten
Option auf true
gesetzt ist, gibt sie eine Sequenz sowohl der Knoten zurück, die diesem Slot zugewiesen sind, als auch der Knoten, die jedem anderen Slot zugewiesen sind, der ein Nachfahre dieses Slots ist. Wenn keine zugewiesenen Knoten gefunden werden, gibt sie den Fallback-Inhalt des Slots zurück.
Syntax
assignedNodes()
assignedNodes(options)
Parameter
Rückgabewert
Ein Array von Knoten.
Beispiele
Der folgende Ausschnitt stammt aus unserem slotchange Beispiel (Live ansehen).
let slots = this.shadowRoot.querySelectorAll("slot");
slots[1].addEventListener("slotchange", (e) => {
let nodes = slots[1].assignedNodes();
console.log(
`Element in Slot "${slots[1].name}" changed to "${nodes[0].outerHTML}".`,
);
});
Hier holen wir Referenzen zu allen Slots und fügen dann einen Slotchange-Event-Listener dem zweiten Slot im Template hinzu – was derjenige ist, dessen Inhalt im Beispiel immer wieder geändert wird.
Jedes Mal, wenn das in den Slot eingefügte Element sich ändert, protokollieren wir einen Bericht in der Konsole, der angibt, welcher Slot sich geändert hat und was der neue Knoten innerhalb des Slots ist.
Spezifikationen
Specification |
---|
HTML Standard # dom-slot-assignednodes-dev |
Browser-Kompatibilität
BCD tables only load in the browser