# MutationObserver, με το βλέμμα στις αλλαγές του DOM 🧐

Η Javascript έχει ένα ωραίο interface για την παρακολούθηση αλλαγών στο dom, το **_MutationObserver_**. Δέχεται ως πρώτη παράμετρο ένα callback που μας δίνει πρόσβαση σε μια λίστα από mutations.

```
const observer = new MutationObserver(function (mutationList, observer) {
    for (const mutation of mutationList) {
      //
    }
});
```

Τα mutations έχουν μερικά χρήσιμα attributes, όπως τα addedNodes, removedNodes και target

```
observer.observe(document.querySelector('body'), { childList: true, subtree: true });
```

Φαντάσου ένα σενάριο όπου ελέγχεις μόνο ένα συγκεκριμένο script μιας σελίδας και το υπόλοιπο dom το χειρίζονται άλλα scripts. Τα mutation observers μπορούν να φανούν χρήσιμα για να εντοπίσεις πότε ένας κόμβος αφαιρείται ή προστίθεται. Επιπλέον, [υποστηρίζονται αρκετά καλά](https://caniuse.com/?search=MutationObserver).