Question

Is it possible to determine when setting an innerHTML has loaded?
I’m not sure if it’s a synchronous operation. I assume the ‘building the DOM’ is synchronous, but loading tags, contents, etc isn’t.

So in a nutshell – is there a way to get an event when innerHTML has completed loading?

Thanks!

Answer 1

 var waitUntil = function (fn, condition, interval) {
    interval = interval || 100;

    var shell = function () {
            var timer = setInterval(
                function () {
                    var check;

                    try { check = !!(condition()); } catch (e) { check = false; }

                    if (check) {
                        clearInterval(timer);
                        delete timer;
                        fn();
                    }
                },
                interval
            );
        };

    return shell;
};

Use it like this:

waitUntil(
  function () {
    // the code you want to run here...
  },
  function() {
    // the code that tests here... (return true if test passes; false otherwise)
    return !!(document.getElementById('<id of the div you want to update>').innerHTML !== '');
  },
  50 // amout to wait between checks
)();