Lez.3 Corso Base JavaScript

Collocazione e sintassi del Codice in JavaScript

Collocazione del Codice JavaScript

Per inserire il codice JavaScript è sufficiente inserirlo nel tag <script> </script>.

Il tag script a sua volta può essere inserito in qualsiasi parte dell'html, cioè può essere inserito nel'head o nel body.

Il codice verrà visualizzato o attivato nelle sue funzioni esattamente nel punto della pagina in cui è stato inserito, questo perché segue il flusso della pagina.

Quanto descritto vale se le righe di codice JavaScript non sono molte, se sono diverse decine o addirittura centinaia, per una migliore pulizia e leggibilità del codice è consigliabile appoggiarsi ad una pagine esterna.

Per prima cosa dobbiamo definire un nuovo file e salvarlo con estensione .js

Il file con estensione .js andrà salvato (è consigliabile), nella cartella pricipale del sito web, per intenderci, dove ci sarà anche la Home page.

Ora colleghiamo il nome_file.js (nome_file.js è puramente arbitrario, potete chiamarlo come volete l'importante è che abbia l'estensione .js) alla pagina che vogliamo fruisca delle funzioni JavaScript, questo viene fatto aggiungendo nel tag <head></head> il seguente codice:
<script src="nome_file.js"></script>

Sintassi del Codice JavaScript

JavaScript, come tutti gli altri linguaggi di programmazione, si basa su parole chiave e su istruzioni o comandi che implementiamo all'interno del codice.

Quindi JavaScript ha delle parole chiave ed una sintassi tipica che prevede l'utilizzo di istruzioni separate da un punto e virgola ; e tutte le istruzioni possono essere raccolte all'interno di parentesi graffe { }

Un'altra cosa importante da dire è che JavaScript è casesensitive (che tiene conto delle caratteri maiuscoli e minuscoli) cioè che bisogna rispettare rigorosamente i caratteri se sono maiuscoli o minuscoli e trascriverli esattamente così come sono.

Descriviamo l'esempio del codice sottostante.
Abbiamo un'evento (onclick) che fa partire una funzione (function) e nelle graffe { } c'è il blocco di codice che dice:
il codice innerHTML (inner - interno) interno all'oggetto paperino, fa in modo che quello che c'è, deve essere sostituito con il testo che è scritto negli apici.

Il Codice:
<!DOCTYPE html>
<html lang="it">                     
 <head>			    
  <title>Collocazione e Sintassi del Codice JavaScript</title>
  <meta charset="utf-8">
        <!-- Esempio di Collegamento 
        ad una pagina esterna in JavaScript -->
  <script src="nome_file.js"></script>
 </head>
 <body>
  <h1>Sintassi del Codice Javascript</h1>
  <p id="topolino">Paragrafo con id topolino <br>che se ci  clicchi sopra...???</p>
  <p id="paperino">Paragrafo con id paperino</p>
  <script>
	  topolino.onclick=function(){
		  paperino.innerHTML="Ciao ha visto!!! <br>ora aggiorna la  pagina e ricomincia quante volte vuoi.";
	  }
  </script>
 </body>                
</html>