Готовность DOM

С помощью событий JavaScript можно выполнить функцию, код HTML — после загрузки указанного элемента или полностью веб-страницы.

JavaScript ready()

Проверить готовность веб-страницы:

var callback = function(){
  // выполнить, когда дом будет полностью загружен
};

if (
    document.readyState === "complete" ||
    (document.readyState !== "loading" && !document.documentElement.doScroll)
) {
  callback();
} else {
  document.addEventListener("DOMContentLoaded", callback);
}

Небольшая библиотека domReady уже реализовала это решение, демонстрация.

Обнаружить готовность документа в IE8 и старее, можно событием onreadystatechange.

document.attachEvent("onreadystatechange", function(){
  // проверить готовность DOM
  if(document.readyState === "complete"){
    // убрать выполнение в будущем
    document.detachEvent("onreadystatechange", arguments.callee);
    // выполнить, когда дом будет полностью загружен
  }
});

В качестве альтернативы можно использовать событие jQuery .ready() — это будет работать в любом браузере. Но помните, не рекомендуется применять метод .ready() для элементов, например $(document).ready(). Потому что в jQuery 3.0, методы готовности документа, за исключением $(handler); считаются устаревшими.

Официальное оправдание:

Метод .ready() неэффективный и может привести к ошибкам поведения.

Подробности на блоге «jQuery».