Теоретически, не правда, что наш код может добавить прослушиватель событий для DOM Ready, но когда мы добавляем его, уже слишком поздно?
Например, если мы ссылаемся на .js файл в конце <body> ... </body>, и время загрузки этого .js файла составляет 2 или 3 секунды спустя, и DOM уже давно готов, событие уже запущено, и все слушатели уведомлены, и теперь JS код
window.addEventListener('DOMContentLoaded', (event) => {
console.log('DOM Ready event fired');
});
и действительно ли сейчас слишком поздно, и обработчик никогда не будет вызван? На практике этого не происходит и не должно происходить, потому что тогда будет странное поведение. Так как это обрабатывается? Обозначает ли браузер «задним числом» уведомления слушателей (даже если слушатель был добавлен слишком поздно, браузер уведомит об этом?).
Сказав это, «браузер уведомит слушателя, даже если он был добавлен слишком поздно». неверно, если мы зарегистрируем прослушиватель готовности DOM внутри обработчика готовности DOM:
window.addEventListener('DOMContentLoaded', (event) => {
console.log('DOMContentLoaded event fired 01');
window.addEventListener('DOMContentLoaded', (event) => {
console.log('DOM Ready event fired 02');
});
});
Другой способ - это когда мы загружаем страницу, а затем в консоли отладки набираем
window.addEventListener('DOMContentLoaded', (event) => {
console.log('DOM Ready event fired');
});
Это даже правда, что если мы пропустили текущий цикл событий, тогда он не будет вызван:
setTimeout(function() {
window.addEventListener('DOMContentLoaded', (event) => {
console.log('DOM Ready event fired');
});
}, 0);
Так в чем же заключается правило, если слушатель добавляется слишком поздно?