<script>: l'elemento HTML Script

L' elemento HTML <script> viene utilizzato per incorporare codice o dati eseguibili; questo è in genere usato per incorporare o fare riferimento al codice JavaScript. L'elemento <script> può essere utilizzato anche con altri linguaggi, come il linguaggio di programmazione shader GLSL di WebGL e JSON.

Attributi

async

Per gli script classici, se l'attributo async è presente, lo script classico verrà recuperato parallelamente all'analisi e valutato non appena sarà disponibile.

Per gli script del modulo, se l'attributo async è presente, gli script e tutte le loro dipendenze verranno eseguiti nella coda di rinvio, quindi verranno recuperati parallelamente all'analisi e valutati non appena saranno disponibili.

Questo attributo consente l'eliminazione di JavaScript che blocca il parser in cui il browser dovrebbe caricare e valutare gli script prima di continuare l'analisi. defer ha un effetto simile in questo caso.

Questo è un attributo booleano: la presenza di un attributo booleano su un elemento rappresenta il valore vero e l'assenza dell'attributo rappresenta il valore falso.

crossorigin

Gli elementi normali script trasmettono informazioni minime agli script window.onerror for che non superano i controlli CORS standard . Per consentire la registrazione degli errori per i siti che utilizzano un dominio separato per il supporto statico, utilizzare questo attributo.

defer

Questo attributo booleano è impostato per indicare a un browser che lo script deve essere eseguito dopo che il documento è stato analizzato, ma prima dell'attivazione DOMContentLoaded.

Gli script con l'attributo defer impediranno l'attivazione dell'evento DOMContentLoaded fino al caricamento dello script e al termine della valutazione.

Gli script con l'attributo defer verranno eseguiti nell'ordine in cui appaiono nel documento.

Questo attributo consente l'eliminazione di JavaScript che blocca il parser in cui il browser dovrebbe caricare e valutare gli script prima di continuare l'analisi. async ha un effetto simile in questo caso.

fetchpriority

Fornisce un suggerimento sulla priorità relativa da utilizzare durante il recupero di uno script esterno. Valori consentiti:

high

Segnala un recupero ad alta priorità rispetto ad altri script esterni..

low

Segnala un recupero a bassa priorità rispetto ad altri script esterni.

auto

Predefinito: segnala la determinazione automatica della priorità di recupero rispetto ad altri script esterni.

integrity

Questo attributo contiene metadati inline che un programma utente può utilizzare per verificare che una risorsa recuperata sia stata consegnata senza manipolazioni impreviste.

nomodule

Questo attributo booleano è impostato per indicare che lo script non deve essere eseguito nei browser che supportano i moduli ES2015 : in effetti, può essere utilizzato per servire script di fallback a browser meno recenti che non supportano il codice JavaScript modulare.

nonce

Un nonce crittografico (numero utilizzato una volta) per consentire gli script in un script-src Content-Security-Policy . Il server deve generare un valore nonce univoco ogni volta che trasmette una politica. È fondamentale fornire un nonce che non può essere indovinato poiché bypassare la politica di una risorsa è altrimenti banale.

referrerpolicy

Indica quale referrer inviare durante il recupero dello script o le risorse recuperate dallo script:

  • no-referrer: L'intestazione Referer non verrà inviata.
  • no-referrer-when-downgrade: L'intestazione Referer non verrà inviata a origini senza TLS ( HTTPS ).
  • origin: Il referrer inviato sarà limitato all'origine della pagina referente: il suo schema , host e porta .
  • origin-when-cross-origin: il referrer inviato ad altre origini sarà limitato allo schema, all'host e alla porta. Le navigazioni sulla stessa origine includeranno comunque il percorso.
  • same-origin: verrà inviato un referrer per la stessa origine , ma le richieste cross-origin non conterranno informazioni sul referrer.
  • strict-origin: Invia l'origine del documento come referrer solo quando il livello di sicurezza del protocollo rimane lo stesso (HTTPS→HTTPS), ma non inviarlo a una destinazione meno sicura (HTTPS→HTTP).
  • strict-origin-when-cross-origin (impostazione predefinita): invia un URL completo quando si esegue una richiesta della stessa origine, invia l'origine solo quando il livello di sicurezza del protocollo rimane lo stesso (HTTPS→HTTPS) e non invia alcuna intestazione a una destinazione meno sicura (HTTPS→HTTP).
  • unsafe-url: Il referrer includerà l'origine e il percorso (ma non il frammento , la password o il nome utente ). Questo valore non è sicuro , perché perde origini e percorsi dalle risorse protette da TLS a origini non sicure.

src

Questo attributo specifica l'URI di uno script esterno; questo può essere utilizzato come alternativa all'incorporamento di uno script direttamente all'interno di un documento.

type

Questo attributo indica il tipo di script rappresentato. Il valore di questo attributo sarà in una delle seguenti categorie:

  • Omesso o un tipo MIME JavaScript: indica che lo script è JavaScript. La specifica HTML5 esorta gli autori a omettere l'attributo piuttosto che fornire un tipo MIME ridondante. Nei browser precedenti, questo identificava il linguaggio di scripting del srccodice incorporato o importato (tramite l'attributo).
  • module: Fa sì che il codice venga trattato come un modulo JavaScript. L'elaborazione del contenuto dello script non è influenzata dagli attributi charset e defer. A differenza degli script classici, gli script dei moduli richiedono l'uso del protocollo CORS per il recupero tra le origini.
  • Qualsiasi altro valore: il contenuto incorporato viene trattato come un blocco di dati che non verrà elaborato dal browser. Gli sviluppatori devono utilizzare un tipo MIME valido che non sia un tipo MIME JavaScript per denotare i blocchi di dati. L'attributo src verrà ignorato.

Attributi deprecati

charset

Se presente, il suo valore deve essere una corrispondenza ASCII senza distinzione tra maiuscole e minuscole per "utf-8". Non è necessario specificare l'attributo charset, poiché i documenti devono utilizzare UTF-8 e l'elemento script eredita la codifica dei caratteri dal documento.

language

Come l'attributo type, questo attributo identifica il linguaggio di scripting in uso. A differenza dell'attributo type, tuttavia, i possibili valori di questo attributo non sono mai stati standardizzati. Al suo posto dovrebbe essere utilizzato l'attributo type.

Esempi

Utilizzo di base

Questi esempi mostrano come importare uno script (esterno) utilizzando l'elemento <script>.

<script src="javascript.js"></script>

E gli esempi seguenti mostrano come inserire uno script (inline) all'interno dell'elemento <script>.

<script>
  alert("Helo World");
</script>

Modulo di riserva

I browser che supportano il valore module per l'attributo type ignorano qualsiasi script con un attributo nomodule. Ciò ti consente di utilizzare gli script dei moduli fornendo anche script nomodule di fallback contrassegnati per i browser che non supportano.

<script type="module" src="main.js"></script>
<script nomodule src="fallback.js"></script>