Skip to content

Instantly share code, notes, and snippets.

@mmoravec

mmoravec/dom_mutation.js

Created August 7, 2015 16:31
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save mmoravec/264e2b9b2fe9b6391425 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save mmoravec/264e2b9b2fe9b6391425 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. mmoravec created this gist Aug 7, 2015.
    60 changes: 60 additions & 0 deletions dom_mutation.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,60 @@
    (function(win) {
    'use strict';

    var listeners = [],
    doc = win.document,
    MutationObserver = win.MutationObserver || win.WebKitMutationObserver,
    observer;

    function waitForElement(selector, repeat, fn) {

    // Store the selector and callback to be monitored
    listeners.push({
    selector: selector,
    fn: fn,
    repeat: repeat,
    });
    if (!observer) {
    // Watch for changes in the document
    observer = new MutationObserver(check);
    observer.observe(doc.documentElement, {
    childList: true,
    subtree: true
    });
    }
    // Check if the element is currently in the DOM
    check();
    }

    function check() {
    // Check the DOM for elements matching a stored selector
    for (var i = 0, len = listeners.length, listener, elements; i < len; i++) {
    listener = listeners[i];
    // Query for elements matching the specified selector
    elements = doc.querySelectorAll(listener.selector);
    for (var j = 0, jLen = elements.length, element; j < jLen; j++) {
    element = elements[j];
    if (!element.ready || listener.repeat) {
    // Invoke the callback with the element
    listener.fn.call(element, element);
    }
    }
    }
    }

    function activateOnDOMMutation(selector, activate, repeat) {
    repeat = repeat === undefined ? false : repeat;
    if (window.MutationObserver || window.WebKitMutationObserver) {
    waitForElement(selector, repeat, function(element) {
    activate();
    });
    } else {
    // this solution does not handle older browsers
    }
    }

    // Expose functions
    win.waitForElement = waitForElement;
    win.activateOnDOMMutation = activateOnDOMMutation;

    })(this);