L'élément HTML <script> est utilisé pour intégrer ou faire référence à un script exécutable.
Les scripts sans attribut async ou defer sont chargés et exécutés immédiatement avant que le navigateur continue l'analyse de la page.
| Catégories de contenu | Contenu de flux, contenu phrasé, contenu de méta-données. |
|---|---|
| Contenu autorisé | Script dynamique tel que text/javascript. |
| Omission de balises | Aucune, la balise d'ouverture et la balise de fermeture sont obligatoires |
| Parents autorisés | Tout élément acceptant du contenu de méta-données ou tout élément acceptant du contenu phrasé. |
| Rôles ARIA autorisés | Aucun. |
| Interface DOM | HTMLScriptElement |
Attributs
Cet élément inclut les attributs universels.
asyncHTML5- Cet attribut booléen indique si le navigateur doit, dans la mesure du possible, exécuter les scripts de manière asynchrone. Cet attribut n'a aucun effet si le script n'a pas d'attribut
src(par exemple pour les scripts contenus déclarés dans les éléments).
Se référer au tableau de compatibilité ci-après pour les informations concernant la prise en charge par les navigateurs. Voir aussi la page sur les scripts asynchrones avec asm.js. crossorigin- Les balises de
scriptclassiques enverront un minimum d'informations àwindow.onerrorpour les scripts qui ne respectent pas les contrôles standard du CORS. Afin de disposer de plus de renseignements sur les erreurs pour les sites utilisant des domaines séparés pour des documents statiques, on pourra utiliser cet attribut. Voir la page de réglages des attributs CORS pour plus d'explications quant aux valeurs valides. defer- Cet attribut booléen permet d'indiquer au navigateur que le script doit être exécuté après l'analyse du document et avant l'évènement
DOMContentLoaded. Cet attribut ne doit pas être utilisé pour des scripts qui n'ont pas d'attributsrc(par exemple pour les scripts contenus déclarés dans les éléments). integrity- Cet attribut contient des métadonnées que l'agent utilisateur peut vérifier afin de contrôler qu'une ressource téléchargée n'a pas été modifiée de façon frauduleuse. Pour plus d'informations, consulter la page relative à l'intégrité des sous-ressources.
nomodule- Cet attribut booléen indique que le script ne doit pas être exécuté dans le navigateur si celui prend en charge les modules ES6. En pratique, de tels scripts seront utilisés pour couvrir les cas où le navigateur ne prend pas en charge les modules JavaScript.
src- Cet attribut définit l'URI d'un script externe. Cela peut être utilisé pour insérer des scripts autrement qu'en les insérant à même le document. Les éléments
scriptavec un attributsrcdéfini ne doivent pas avoir de script compris dans leurs balises. type- Cet attribut définit le langage de script utilisé par le script contenu dans l'élément ou référencé via l'attribut
src. La valeur de cet attribut est un type MIME. Des exemples de types MIME pris en charge sonttext/javascript,text/ecmascript,application/javascriptetapplication/ecmascript. Si cet attribut est absent, le script est interprété comme du JavaScript. - Si le type MIME indiqué n'est pas un type correspondant à JavaScript, le contenu de l'élément sera considéré comme un bloc de données et ne sera pas traité par le navigateur.
- Si le type indiqué est
module, le code est traité comme un module JavaScript . Pour plus de détails, lire ES6 en détails : les modules. text- Like the
textContentattribute, this attribute sets the text content of the element. Unlike thetextContentattribute, however, this attribute is evaluated as executable code after the node is inserted into the DOM.
Attributs dépréciés
language- Comme l'attribut
type, cet attribut spécifie le langage de script utilisé. Cependant, contrairement à l'attributtypeles valeurs possibles de cet attribut n'ont jamais été normalisées. Il est recommandé d'utiliser l'attributtypeplutôt que celui-là.
Notes
Le script doit être servi avec le type MIME text/javascript. Cependant, les navigateurs appliquent cette règle avec une certaine flexibilité et ne bloquent que si le script est servi avec un type image (image/*), vidéo (video/*) ou audio (audio/*) ou CSV (text/csv). Si le script est bloqué, un évènement error sera déclenché sur l'élément, sinon, l'évènement load sera envoyé.
Exemples
<!-- HTML4 et (x)HTML --> <script type="text/javascript" src="javascript.js"></script> <!-- HTML5 --> <script src="javascript.js"></script>
Spécifications
| Spécification | État | Commentaires |
|---|---|---|
| WHATWG HTML Living Standard La définition de '<script>' dans cette spécification. |
Standard évolutif | Ajout du type module. |
| HTML5 La définition de '<script>' dans cette spécification. |
Recommendation | |
| HTML 4.01 Specification La définition de '<script>' dans cette spécification. |
Recommendation | |
| Subresource Integrity La définition de '<script>' dans cette spécification. |
Recommendation | Ajout de l'attribut integrity. |
Compatibilité des navigateurs
| Fonctionnalité | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| Support simple | 1.0 | (Oui) | 1.0 (1.7 ou moins)[2] | (Oui) | (Oui) | (Oui) |
Attribut async |
(Oui)[1] | (Oui) | 3.6 (1.9.2)[1] | 10[1] | 15[1] | (Oui)[1] |
Attribut defer |
(Oui) | (Oui) | 3.5 (1.9.1)[6] |
4[3] |
Pas de support | (Oui) |
Attribut crossorigin |
30.0 | (Oui) | 13 (13) | Pas de support | 12.50 | (Oui)[4] |
Attribut integrity |
45.0 | Pas de support | 43 (43) | ? | ? | Pas de support[5] |
Attribut nomodule |
(Oui) | Pas de support | Pas de support[7] | Pas de support | Pas de support | Pas de support |
| Fonctionnalité | Android | Webview Android | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile | Chrome pour Android |
|---|---|---|---|---|---|---|---|---|
| Support simple | (Oui) | (Oui) | (Oui) | 1.0 (1.0)[2] | (Oui) | (Oui) | (Oui) | (Oui) |
Attribut async |
(Oui)[1] | (Oui)[1] | (Oui) | 1.0 (1.0)[1] | Pas de support[1] | ?[1] | (Oui)[1] | (Oui)[1] |
Attribut defer |
(Oui) | (Oui) | (Oui) | 1.0 (1.0) | Pas de support | ? | (Oui) | (Oui) |
Attribut integrity |
Pas de support | 45.0 | Pas de support | 43 (43) | ? | ? | ? | 45.0 |
Attribut nomodule |
Pas de support | (Oui) | Pas de support | Pas de support[7] | Pas de support | Pas de support | Pas de support |
[1] Pour les anciens navigateurs qui ne prennent pas en charge l'attribut async attribute, les scripts insérés lors de l'analyse (parsing) bloquent l'analyseur, les scripts insérés par d'autres scripts s'exécutent en asynchrone sous IE et WebKit et en synchrone sous Opera et sous Firefox pour les versions antérieures à Firefox 4.0. Sous Firefox 4.0, la propriété async du DOM vaut true par défaut pour les scripts créés par des scripts afin que le comportement par défaut corresponde au comportement d'IE et de WebKit. Afin que les scripts insérés par des scripts externes soient lancés dans l'ordre d'insertion, on définira .async=false pour les scripts dont on souhaite conserver l'ordre d'exécution. document.write() ne doit jamais être appelé sur un script asynchrone avec async. Sous Gecko 1.9.2, si on appelle document.write(), cela aura un effet imprévisible. Pour Gecko 2.0, appeler document.write() depuis un script asynchrone n'aura aucun effet (en dehors d'afficher un message d'erreur dans la console).
[2] À partir de Gecko 2.0 (Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1), insérer des scripts grâce à la méthode document.createElement("script") dans le DOM ne force plus l'ordre d'exécution des scripts selon leur ordre d'insertion. Cela permet à Gecko de respecter la spécification HTML5. Afin que les scripts insérés de cette façon soient exécutés selon leur ordre d'insertion, on utilisera .async=false pour ces éléments.
Les éléments <script> contenus dans les éléments <iframe>, <noembed> et <noframes> sont désormais exécutés pour les mêmes raisons.
[3] Pour les versions antérieures à Internet Explorer 10, Trident implémentait une spécification propriétaire pour <script>. Depuis la version 10, IE se conforme à la spécification W3C.
[4] L'attribut crossorigin a été implémenté dans WebKit avec WebKit bug 81438.
[5] WebKit bug 148363 suit l'implémentation WebKit des fonctionnalités relatives à l'intégrité des sous-ressources (y compris la gestion de l'attribut integrity).
[6] Depuis Gecko 1.9.2 (Firefox 3.6 / Thunderbird 3.1 / Fennec 1.0), l'attribut defer est ignoré pour les scripts qui n'ont pas d'attribut src. Toutefois, pour Gecko 1.9.1 (Firefox 3.5 / Thunderbird 3.0 / SeaMonkey 2.0) les scripts sont exécutés après l'analyse du document si l'attribut defer est présent.
[7] nomodule est actuellement désactivé via une préférence dans Firefox. Pour le tester, aller dans about:config et passer la valeur de dom.moduleScripts.enabled à true.