MutationObserver – Как использовать в Java

Что такое Mutation Observer?

Mutation Observer – это встроенный объект, который позволяет наблюдать и реагировать на изменения в DOM. Это мощный инструмент для создания динамических веб-приложений, требующих манипулирования DOM и обработки событий в реальном времени. С помощью Mutation Observer вы можете отслеживать изменения в определенных узлах, атрибутах или дочерних элементах документа и выполнять пользовательские функции, реагирующие на эти изменения.

В библиотеке Aspose.HTML for Java механизм наблюдения за документами представлен в виде класса MutationObserver, который легко настраивается и позволяет получать уведомления о любых изменениях в дереве документа. В этой статье на примерах Java показано, как можно использовать класс MutationObserver для наблюдения за изменениями в DOM.

Как использовать Mutation Observer

В следующем примере демонстрируется реализация MutationObserver и то, как его использовать для наблюдения за добавлением новых узлов в документ.

Создайте новый экземпляр класса HTMLDocument, используя конструктор HTMLDocument().
Создайте новый объект MutationObserver, используя конструктор MutationObserver(). Конструктор принимает объект MutationCallback в качестве параметра, который используется как функция обратного вызова для обработки мутаций.
Используйте конструктор MutationObserverInit() для создания объекта MutationObserverInit. Вы можете указать, какие изменения следует обнаруживать. Например, в этом примере свойствам ChildList, Subtree и CharacterData присвоено значение true.
Вызовите метод observe(), чтобы начать наблюдать за изменениями DOM. Когда происходят изменения в элементе <body> или его дочерних узлах, которые соответствуют настроенным параметрам, будет вызываться функция обратного вызова для обработки этих мутаций.
Отредактируйте HTML-документ. Например, используйте метод createElement() для создания нового элемента <p> и используйте метод appendChild() для добавления его в тело документа; используйте метод createTextNode(), чтобы создать текстовый узел с содержимым «Hello, World!», и используйте метод appendChild(), чтобы добавить его в качестве дочернего узла к элементу <p>.
Как только происходит изменение дерева DOM, запускается функция обратного вызова MutationObserver, которая выводит на консоль сообщение, указывающее, какой узел был добавлен в документ.

 1// Create an empty HTML document
 2HTMLDocument document = new HTMLDocument();
 3
 4// Create an instance of the MutationObserver
 5MutationObserver observer = new MutationObserver(new MutationCallback() {
 6    @Override
 7    public void invoke(com.aspose.html.utils.collections.generic.IGenericList<MutationRecord> mutations, MutationObserver mutationObserver) {
 8        for (int i = 0; i < mutations.size(); i++) {
 9            MutationRecord record = mutations.get_Item(i);
10            for (Node node : record.getAddedNodes().toArray()) {
11                System.out.println("The '" + node + "' node was added to the document.");
12            }
13        }
14    }
15});
16
17// Configure options for the MutationObserver
18MutationObserverInit config = new MutationObserverInit();
19config.setChildList(true);
20config.setSubtree(true);
21config.setCharacterData(true);
22
23// Pass to observer the target node to observe with the specified configuration
24observer.observe(document.getBody(), config);
25
26// Now, we are going to modify DOM tree to check
27// Create a paragraph element and append it to the document body
28Element p = document.createElement("p");
29document.getBody().appendChild(p);
30// Create a text and append it to the paragraph
31Text text = document.createTextNode("Hello World");
32p.appendChild(text);
33
34System.out.println("Waiting for mutation. Press any key to continue...");
35System.in.read();

view raw EAdvanced_MutationObserver hosted with ❤ by GitHub

MutationObserver – Как использовать в Java

Что такое Mutation Observer?

Как использовать Mutation Observer

Рекомендации