Top
Mutation Observer konfigurieren
  • 06 Jun 2024
  • 2 Minuten zu lesen
  • Dunkel
    Licht
  • pdf

Mutation Observer konfigurieren

  • Dunkel
    Licht
  • pdf

Artikel-Zusammenfassung

Was ist MutationObserver?

MutationObserver ist eine Web-API, die es den Entwicklern ermöglicht, Änderungen am DOM (Document Object Model) einer Webseite zu beobachten. Wenn aktiviert, hört MutationObserver auf bestimmte Arten von Mutationen oder Änderungen im DOM und löst Aktionen basierend auf diesen Änderungen aus.


Im Falle von Whatfix überwacht Whatfix bei aktivierter Mutation Observer-Konfiguration Mutationen auf der Seite, die der angegebenen Konfiguration entsprechen. Diese Konfiguration wird von Smart-Tips, Beacons, Launchers und Smart Context verwendet.

Durch Festlegung dieser Konfiguration kann Whatfix die MutationObserver-API verwenden, um Änderungen auf der Seite zu überwachen. Dies ermöglicht es Whatfix, seinen Inhalt dynamisch anzupassen, z. B. Smart-Tips, basierend auf Änderungen in der zugrunde liegenden DOM-Struktur der Webanwendung. Zum Beispiel kann Whatfix Änderungen erkennen, wenn Elemente auf der Seite dynamisch hinzugefügt oder entfernt werden, und seine Tooltips entsprechend anpassen.


Gehen Sie wie folgt vor, um Mutation Observer zu konfigurieren:

  1. Auf dem Whatfix Guidance Dashboard, klicken Sie Einstellungen.
    ia_left_nav_settings

  2. Klicken Sie Advanced Customisation.
    ia_settings_advanced%20configuration

  3. Klicken Sie Technische Konfiguration.
    ac_tech config.png

  4. Klicken Sie Präferenzen hinzufügen.
    tech config_add prefrences.png

  1. Basierend auf den Mutationen, die Sie überwachen möchten, ermöglicht es Ihnen Whatfix, den Mutationsbeobachter für das Folgende zu konfigurieren:
Smart Tips, Beacons und Launchers

  • Klicken Sie Gemeinsame Eigenschaften.
    tech config_common properties.png

  • Wählen Sie das Kontrollkästchen für Mutationsbeobachter Konfig aus.
    tech config_enable mutation observer config.png

Page Tags

Diese Konfiguration wird von Smart Context verwendet, um alle Widgets neu zu bewerten, wenn sich die Page Tags aufgrund dieser Mutationen geändert haben.

  • Klicken Sie Gemeinsame Eigenschaften.
    tech config_common properties.png

  • Wählen Sie das Kontrollkästchen für Mutationsbeobachter Konfig aus.
    tech config_enable mutation observer for smart context.png

User Actions

  • Klicken Sie User Action.
    tech config_user action.png

  • Wählen Sie die Mutationsbeobachter Konfig für User Action Checkbox.
    tech config_enable mutation observer for ua.png

  1. Klicken Sie Hinzufügen.
    tech config_add button.png

  2. Wählen Sie in der Dropdown-Liste Konfiguration die Mutationen, die Sie beobachten möchten.
    image.png

your title goes here

Whatfix beobachtet die folgenden Arten von Mutationen:

Attribute: Wann ein HTML-Element seine Eigenschaften ändert, wie seine Klasse oder ID, wird es als Mutation von Attributen bezeichnet. Wenn sich zum Beispiel die Farbe eines Knopfes von blau nach rot ändert, ist das eine Attributmutation.

Kinderliste: Mutationen von Kinderlisten, wenn neue Dinge hinzugefügt oder von einem Teil einer Webseite weggenommen werden. Das könnte bedeuten, Dinge zu ergänzen oder zu entfernen oder die Reihenfolge zu ändern. Zum Beispiel, wenn Sie einen neuen Artikel auf einer Website zum Warenkorb hinzufügen das ist eine Mutation der untergeordneten Liste, weil Sie ändern, was innerhalb des Containers ist.

Subtree: Mutationen von Subbaum treten auf, wenn sich irgendetwas innerhalb eines bestimmten Teils einer Webseite ändert. Dies könnte alles sein, von der Änderung der Größe eines Bildes bis hin zum Hinzufügen eines neuen Absatzes. Wenn es in dem Bereich, den wir betrachten, geschieht, zählt es als Subtree-Mutation.

  1. Klicken Sie Speichern.
    tech config_save.png

War dieser Artikel hilfreich?

Changing your password will log you out immediately. Use the new password to log back in.
First name must have atleast 2 characters. Numbers and special characters are not allowed.
Last name must have atleast 1 characters. Numbers and special characters are not allowed.
Enter a valid email
Enter a valid password
Your profile has been successfully updated.