Comment déterminer si le DOM est chargé?

Utiliser l'événement DOMContentLoaded.

document.addEventListener('DOMContentLoaded', () => {
  // Code à exécuter après le chargement du DOM
});

Alternativement, vous pouvez vérifier la propriété document.readyState:

if (document.readyState === 'loading') {
  document.addEventListener('DOMContentLoaded', () => {
    // Code
  });
} else {
  // Le DOM est déjà chargé
}

L'événement DOMContentLoaded se déclenche après le chargement et l'analyse complets du document HTML, mais avant le chargement des ressources externes comme les styles et les images.

Pour détecter le chargement complet de la page, y compris toutes les ressources, utilisez l'événement load:

window.addEventListener('load', () => {
  // Code à exécuter après le chargement complet de la page
});