Comme vous le savez probablement, la balise est utilisée pour spécifier quel JavaScript exécuter sur une page Web. La balise <script> peut contenir du code JavaScript directement ou pointer vers une URL externe JavaScript. </p> <h3 id="script-">Les balises<script> sont exécutées dans l'ordre dans lequel elles apparaissent </h3> <p>Le code suivant illustre cela de manière intuitive : </p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:js;toolbar:false;"><script> var x = 3; alert(x); // Will alert '3'; Copier après la connexionIl n'y a pas d'ordre de chargement lors de l'utilisation de ressources de liens externes Tellement intuitif , mais toujours vrai : Copier après la connexionRecommandations d'apprentissage associées : Tutoriel vidéo javascriptSi vous mélangez liens externes et inline Pour JavaScript, même règle s'applique. Cela signifie que si votre site contient des scripts lents qui se chargent plus tôt dans la page, le chargement de votre page sera nettement plus lent. Cela signifie également que les scripts chargés ultérieurement peuvent dépendre des scripts chargés plus tôt. Un élément de page ne sera rendu que lorsque tous les scripts qui le précèdent auront été chargés. Cela signifie que vous pouvez faire toutes sortes de choses folles sur vos pages Web avant qu'elles ne se chargent, tant que vous ne vous souciez pas des problèmes de performances que cela provoque. Cependant, cette règle ne s'applique pas lorsque vous ajoutez la balise au DOM via des méthodes telles que <code>document.appendChild</code> après le chargement de la page Web. Ces balises exécuteront les scripts dans l'ordre dans lequel le traitement des requêtes du navigateur est terminé, et l'ordre de chargement n'est plus garanti. </p><h3 id="-script-html-">Lorsqu'une balise <script> est exécutée, les éléments HTML qui la précèdent sont accessibles (mais ceux qui la suivent ne le sont pas encore) </h3><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:js;toolbar:false;"><html> <head> <script> // document.head is available // document.body is not! // document.head is available // document.body is available