Analyzing your prompt, please hold on...
An error occurred while retrieving the results. Please refresh the page and try again.
MutationObserver – Wie man in Java verwendet
Contents
[
Hide
Show
]Was ist ein Mutationsbeobachter?
Mutation Observer ist ein integriertes Objekt, das eine Möglichkeit bietet, Änderungen im DOM zu beobachten und darauf zu reagieren. Es ist ein leistungsfähiges Werkzeug für die Erstellung dynamischer Webanwendungen, die eine DOM-Manipulation und Ereignisbehandlung in Echtzeit erfordern. Mit dem Mutation Observer können Sie Änderungen an bestimmten Knoten, Attributen oder untergeordneten Elementen eines Dokuments überwachen und benutzerdefinierte Funktionen ausführen, die auf diese Änderungen reagieren.
In der Aspose.HTML for Java Bibliothek wird ein Mechanismus zur Beobachtung von Dokumenten durch die Klasse
MutationObserver dargestellt, die einfach zu konfigurieren ist und es ermöglicht, Benachrichtigungen über Änderungen im Dokumentenbaum zu erhalten. Dieser Artikel zeigt anhand von Java-Beispielen, wie Sie die Klasse MutationObserver verwenden können, um Änderungen im DOM zu beobachten.
Wie man Mutationsbeobachter verwendet
Mutation Observer bietet die Möglichkeit, Änderungen im DOM-Baum einer Webseite zu beobachten. Das folgende Beispiel zeigt die Implementierung von MutationObserver und wie man damit das Hinzufügen neuer Knoten zum Dokument beobachten kann.
- Erstellen Sie eine neue Instanz der HTMLDocument-Klasse mit dem Konstruktor HTMLDocument().
- Erstellen Sie ein neues MutationObserver-Objekt mit dem Konstruktor MutationObserver(). Der Konstruktor nimmt ein MutationCallback-Objekt als Parameter, das als Callback-Funktion für die Behandlung von Mutationen verwendet wird.
- Verwenden Sie den Konstruktor
MutationObserverInit(), um ein MutationObserverInit-Objekt zu erstellen. Sie können angeben, welche Art von Änderungen erkannt werden sollen. Zum Beispiel werden die Eigenschaften
ChildList,Subtree, undCharacterDataim Beispiel auftruegesetzt. - Rufen Sie die Methode
observe() auf, um mit der Beobachtung der DOM-Änderungen zu beginnen. Wenn Änderungen im
<body>-Element oder seinen Kindknoten auftreten, die mit den konfigurierten Optionen übereinstimmen, wird die Callback-Funktion aufgerufen, um diese Änderungen zu behandeln. - Bearbeiten Sie das HTML-Dokument. Verwenden Sie zum Beispiel die Methode
createElement(), um ein neues
<p>-Element zu erstellen, und verwenden Sie die Methode appendChild(), um es an den Textkörper des Dokuments anzuhängen; verwenden Sie die Methode createTextNode(), um einen Textknoten mit dem Inhalt “Hello, World!” zu erstellen, und verwenden Sie die Methode appendChild(), um ihn als Kindknoten zum<p>-Element hinzuzufügen. - Sobald eine Änderung im DOM-Baum auftritt, wird die MutationObserver-Callback-Funktion ausgelöst, die eine Meldung auf der Konsole ausgibt, die angibt, welcher Knoten dem Dokument hinzugefügt wurde.
1// Monitor DOM tree changes using MutationObserver API in Aspose.HTML for Java
2
3// Create an empty HTML document
4HTMLDocument document = new HTMLDocument();
5
6// Create an instance of the MutationObserver class
7MutationObserver observer = new MutationObserver(new MutationCallback() {
8
9 @Override
10 public void invoke(com.aspose.html.utils.collections.generic.IGenericList<MutationRecord> mutations, MutationObserver mutationObserver) {
11 for (int i = 0; i < mutations.size(); i++) {
12 MutationRecord record = mutations.get_Item(i);
13 for (Node node : record.getAddedNodes().toArray()) {
14 System.out.println("The '" + node + "' node was added to the document.");
15 }
16 }
17 }
18});
19
20// Configure options for the MutationObserver
21MutationObserverInit config = new MutationObserverInit();
22config.setChildList(true);
23config.setSubtree(true);
24config.setCharacterData(true);
25
26// Pass to observer the target node to observe with the specified configuration
27observer.observe(document.getBody(), config);
28
29// Now, we are going to modify DOM tree to check
30// Create a paragraph element and append it to the document body
31Element p = document.createElement("p");
32document.getBody().appendChild(p);
33
34// Create a text and append it to the paragraph
35Text text = document.createTextNode("Hello, World!");
36p.appendChild(text);
37
38System.out.println("Waiting for mutation. Press any key to continue...");
39System.in.read();Empfehlungen
- Wählen Sie bei der Konfiguration von
MutationObserverbestimmte Ziele aus und konzentrieren Sie sich auf bestimmte Elemente oder Attribute, um die Leistung zu optimieren und unnötige Verarbeitung zu vermeiden. - Verwenden Sie effiziente Rückrufe – halten Sie die Logik in der Rückruffunktion leicht, um Leistungsengpässe zu vermeiden, insbesondere in Szenarien mit hoher Mutationsrate.
- Verwendung von Konfigurationsoptionen – Feinabstimmung der Beobachtungsparameter mit dem
MutationObserverInit-Objekt. Nehmen Sie nur die notwendigen Eigenschaften auf (z.B.ChildList,Subtree,CharacterData), um den Prozess zu optimieren.
Wenn Sie einen Knoten auf Änderungen beobachten, wird Ihr Callback erst ausgelöst, wenn sich das DOM vollständig geändert hat. Dieses Verhalten wurde entwickelt, um DOM Mutation Events zu ersetzen und das Problem der Tötungsleistung in der vorherigen Spezifikation zu reduzieren.
Sie können die vollständigen Beispiele und Datendateien unter GitHub herunterladen.