Pourquoi Document.write efface-t-il la page ?

Lors de l'utilisation de la méthode document.write() en JavaScript, les programmeurs rencontrent souvent un problème particulier comportement : l'invocation de document.write() dans un gestionnaire d'événements, tel que onClick, peut entraîner l'effacement du document.

Pour comprendre ce résultat inattendu, il est essentiel de saisir la nature de document.write(). Cette fonction écrit dans le flux de documents, qui est le flux continu de données représentant le document affiché dans le navigateur.

Dans l'exemple de code fourni :

La fonction validator() est déclenchée lorsque le bouton "validation" est cliqué. Voici ce qui se passe :

1. À ce stade, le chargement du document est probablement terminé, ce qui signifie que le flux de documents est fermé.
2. L'appel de document.write() déclenche automatiquement document.open( ), qui efface le document actuel, supprimant tous les éléments existants.
3. Par la suite, le texte spécifié dans document.write() est rendu dans le document désormais vide.

Par conséquent, les éléments du formulaire (case à cocher et bouton) sont supprimés de la page car l'ensemble du document est actualisé, remplaçant le contenu précédent par la sortie de document.write().

Par conséquent, lorsque vous travaillez avec document.write() , il est crucial de s'assurer que le flux de documents reste ouvert en utilisant explicitement document.open() avant d'y écrire. Sinon, le comportement imprévisible de la suppression du document peut perturber la fonctionnalité prévue.