Getting To Know The MutationObserver API

Avatar of Chris Coyier
Chris Coyier on

Try Mailchimp today. MailChimp Tracking Pixel

MutationObserver watches the DOM, specifically the places you tell it to, like:

document.querySelector('#watch-this');

…and it can tell you (trigger a callback) when stuff happens — like when a child is added, removed, changed, or a number of other things.

I used it just the other day to watch the <head> of a Pen and detected newly-injected processed Sass code, so you could use CodePen to see Sass and CSS side by side:

See the Pen
Sassmeister clone
by Chris Coyier (@chriscoyier)
on CodePen.

Direct Link →