JavaScript è uno dei linguaggi fondamentali per lo sviluppo web. Permette di rendere una pagina HTML interattiva, aggiungendo funzionalità come pulsanti, finestre di dialogo, animazioni, controlli sui form e molto altro. Il codice JavaScript può essere inserito direttamente nel documento HTML oppure caricato da un file esterno.
Nota: puoi approfondire il linguaggio JavaScript nel corso JavaScript gratis di Biadets.
Per inserire codice JavaScript all'interno di una pagina web si utilizza il tag <script>. Questo tag può essere inserito sia all'interno di <head> sia di <body>, a seconda delle esigenze.
Nell'esempio seguente viene utilizzata la funzione alert(valore), che apre una finestra di dialogo contenente il testo specificato.
<script>
alert("Ciao!");
</script>
Nei progetti più grandi è consigliabile salvare il codice JavaScript in un file separato con estensione .js. Per collegarlo alla pagina HTML si utilizza il tag <script> con l'attributo src=”valore”, che indica il percorso del file.
Generalmente gli script esterni vengono caricati nel tag <head> oppure poco prima della chiusura di </body>, in base al comportamento desiderato e alle esigenze di caricamento della pagina. File esterni rendono il codice più ordinato e permettono di riutilizzare lo stesso script in più pagine.
<!DOCTYPE html>
<html>
<head>
<script src="script.js"></script>
</head>
<body>
<p>Collegare un file JavaScript</p>
</body>
</html>
L'attributo onclick=”valore” può essere inserito in quasi tutti gli elementi HTML. Quando l'utente clicca l'elemento, viene eseguito il codice JavaScript specificato nel valore dell'attributo.
Questo attributo è utilizzato molto spesso nei pulsanti creati con il tag <button>, ma può essere applicato anche a immagini, collegamenti e ad altri elementi della pagina per gestire le azioni dell'utente.
<button onclick="alert('Ciao!');">Clicca qui</button>
Il tag <noscript> permette di visualizzare un contenuto alternativo quando JavaScript è disattivato oppure non è supportato dal browser dell'utente. Può contenere testo, immagini o altri elementi HTML che informano l'utente della mancanza di questa funzionalità.
<script>
alert("Ciao!");
</script>
<noscript>Hai disattivato JavaScript</noscript>