Какво е събитието DOMContentLoaded?

Тази събитие се случва, когато първоначалният HTML документ е напълно зареден и анализиран, без да се чака зареждането на стилови таблици, изображения и подрамки.

Основната разлика от събитието load:

• DOMContentLoaded: Ще се активира, когато структурата на DOM е готова.
• load: Ще се активира само след пълното зареждане на всички ресурси на страницата (изображения, CSS, скриптове, ако не са async/defer).

Използване:

// Добавяме слушател за събитието DOMContentLoaded
document.addEventListener('DOMContentLoaded', () => {
  // Код, който трябва да се изпълни след пълното зареждане и анализ на DOM
  console.log('DOM напълно зареден и анализиран.');
});

Това събитие често се използва за изпълнение на JavaScript код, който манипулира DOM, тъй като не е необходимо да се чака зареждането на всички външни ресурси.