métadonnées block
<script>
Intègre ou référence du code JavaScript exécutable. Les attributs async et defer contrôlent le moment de l'exécution.
Description
L’élément <script> permet d’intégrer du JavaScript inline ou de référencer un fichier externe via src. Son comportement de chargement est contrôlé par async et defer. Placé dans <head> avec defer ou type="module", ou en fin de <body>, il évite de bloquer le rendu de la page.
Syntaxe
<script src="app.js" defer></script>
Exemples
Script externe différé (recommandé) :
<head>
<script src="app.js" defer></script>
</head>
Module ES6 :
<script type="module" src="main.js"></script>
Script async pour les analytics :
<script src="analytics.js" async></script>
JSON-LD pour les données structurées :
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "WebSite",
"name": "html6.fr",
"url": "https://html6.fr"
}
</script>
Attributs spécifiques
| Attribut | Type | Description |
|---|---|---|
src | URL | URL du script externe. Si présent, le contenu inline est ignoré. |
type | string | Type de script : omis ou text/javascript (défaut), module (ES modules), importmap, application/ld+json. |
async | boolean | Téléchargement asynchrone, exécution immédiate dès disponibilité. Ordre d’exécution non garanti. |
defer | boolean | Téléchargement asynchrone, exécution après parsing du document. Ordre garanti. |
crossorigin | enum | anonymous ou use-credentials pour les scripts CORS. |
integrity | string | Hash SRI pour vérifier l’intégrité du script externe. |
nomodule | boolean | Script exécuté uniquement si type="module" n’est pas supporté (fallback). |
nonce | string | Valeur CSP pour autoriser ce script inline. |
fetchpriority | enum | high, low, auto — priorité de chargement. |
Notes
async vs defer :
async: exécuté dès le téléchargement terminé, dans n’importe quel ordre. Adapté aux scripts indépendants (analytics, publicité).defer: exécuté après le parsing complet du HTML, dans l’ordre de déclaration. Adapté aux scripts qui manipulent le DOM.type="module": impliquedeferpar défaut.
Performance : toujours utiliser defer ou async sur les scripts externes dans <head>. Sans ces attributs, le script bloque le parsing HTML.
Support navigateurs
Chrome1+ · Firefox1+ · Safari3+ · Edge12+