Où mettre JavaScript dans un document HTML?
Javascript dans la balise
Chaque fois qu'une page HTML est ouverte, la première balise de contenu est chargée, ce qui signifie que toutes les données à l'intérieur sont chargées avant la balise. Si JavaScript est ajouté à la balise de tête, il n'attendra pas le chargement complet de la page Web et sera chargé dans la mémoire du navigateur. Pour démontrer cela, créez une page HTML de base qui invitera l'utilisateur dès qu'il sera chargé dans la mémoire du navigateur.
Prenez le fichier HTML suivant:
Document
Comme vous pouvez le voir, le script est ajouté dans le étiqueter. Cependant, dans l'étiquette corporelle, une image 8K est chargée sur la page Web, qui prendra quelques instants pour charger. Chargez la page HTML et la sortie:
À partir de cette sortie, il est clair que la mise en place du script dans le chargement avant même avant que le Dom ne soit prêt.
Javascript dans la balise
Comme mentionné ci-dessus, on peut placer le javascript dans le étiqueter. Cela permettra au Dom de charger complètement puis de charger le javascript en fonction de sa position dans la balise.
Pour démontrer cela, nous allons créer un bouton sur la page HTML avec les lignes suivantes et dans la fonctionnalité de ce bouton avec les lignes suivantes:
Document
Dans l'extrait de code ci-dessus, un écouteur d'événements est ajouté sur le bouton qui alerte l'utilisateur sur le bouton Appuyez sur tout le tout avec le script à l'intérieur du . Exécutez ce fichier HTML et observez la sortie suivante:
Il est clair à partir de la sortie ci-dessus que le script fonctionne bien dans la balise
JavaScript en balise ou balise
Pour répondre à cette question, prenez le dernier exemple et déplacez simplement la balise de script pour alerter l'utilisateur sur le bouton Appuyez sur la balise comme:
Document
Lors de l'exécution de ce programme, la différence n'est pas visible car la sortie ressemble à ce qui suit:
Cependant, l'ouverture de la console du navigateur montre la différence, car dans la console, il y a cette erreur:
Cette erreur est causée par JavaScript essayant d'obtenir la référence d'un élément de la balise corporelle, qui n'a pas encore été initialisée par DOM parce que le javascript dans la balise de tête a été exécuté avant même que le Dom ne soit complètement chargé.
Ainsi, en conclusion, placer le script dans l'étiquette de tête ou la balise corporelle se résume au fonctionnement de la page Web.
Conclure
JavaScript peut être placé à deux endroits différents à l'intérieur d'un fichier de document HTML dans le Tag ou dans étiqueter. Placer le javascript dans la balise de tête fait charger le script du navigateur avant que le Dom ne soit entièrement prêt. Tandis que y compris le javascript à l'intérieur du Charge le script après que le DOM soit prêt. Pour cette raison, il n'y a pas de place optimale pour inclure JavaScript dans votre document HTML, et cela dépend de la tâche que l'on veut effectuer.