Mi az a DOMContentLoaded esemény?

Ez az esemény akkor következik be, amikor az eredeti HTML-dokumentum teljesen betöltődött és elemzett, anélkül, hogy várnánk a stíluslapok, képek és al-keretek betöltésére.

A fő különbség a load eseményhez képest:

• DOMContentLoaded: Akkor aktiválódik, amikor a DOM szerkezete kész.
• load: Csak akkor aktiválódik, miután az oldal összes erőforrása (képek, CSS, szkriptek, ha nem async/defer) teljesen betöltődött.

Használat:

// Hozzáadunk egy hallgatót a DOMContentLoaded eseményhez
document.addEventListener('DOMContentLoaded', () => {
  // Kód, amelyet a DOM teljes betöltése és elemzése után kell végrehajtani
  console.log('A DOM teljesen betöltődött és elemzett.');
});

Ez az esemény gyakran használatos JavaScript-kód végrehajtására, amely manipulálja a DOM-ot, mivel nem szükséges várni az összes külső erőforrás betöltését.