Sito e-learning

Glossario JavaScript




Sfoglia il glossario usando questo indice

Caratteri speciali | A | B | C | D | E | F | G | H | I | J | K | L | M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z | TUTTI

D

Date()

L’oggetto Date()

JavaScript offre una serie di utility per il controllo e la gestione della data, più che mai di semplice implementazione logica e sintattica rispetto ad altri linguaggi, ma di potenza di gran lunga superiore rispetto agli stessi, il tutto è reso possibile grazie all’utilizzo dell’oggetto Date().

L’ora che verrà visualizzata sarà:

  • l’ora del sistema operativo del browser dell’utente, a questo, con l’utilizzo di un linguaggio di scripting client-side come JavaScript, non c’è rimedio.
  • Per visualizzare l’orario del server bisognerà utilizzare una tecnologia server-side, come PHP, ASP, etc.

Utilizzo e metodi dell’oggetto Date()

L’oggetto Date() viene dichiarato in una variabile di tipo new NOME_OGGETTO(), a questa variabile vengono associati dei metodi che, memorizzati a loro volta in una serie di variabili, vengono poi utilizzate, ad esempio, per stampare a video i relativi output.

Ecco un elenco dei principali metodi dell’oggetto Date():

Metodo per ottenere un valore

Metodo per impostare un valore

Descrizione

getDate()

setDate()

numero del giorno del mese corrente

getDay()

setDay()

numero del giorno della settimana corrente, ad esempio 1=lunedì, 5=Venerdì…

getMonth()

setMonth()

numeri di mese corrente, contati dall’interprete JavaScript da 0 a 11

getFullYear()

setFullYear()

anno corrente

getHours()

setHours()

orario corrente

getMinutes()

setMinutes()

minuti dell’ora corrente

  • getMinutes serve ad ottenere il numero di minuti,
  • setMinutes serve ad impostare i minuti per effettuare calcoli o controlli basati sull’orario.

getSeconds()

setSeconds()

secondi dell’ora corrente

getMilliseconds()

setMilliseconds()

millisecondi dell’ora corrente

La variabile “data” viene dichiarata come una normale variabile atta ad istanziare un oggetto, ad esempio:

var data = new Date();

Sperimentiamo un semplice codice utile a stampare a video l’orario corrente il formato HH:MM:SS:mm, ovvero ore, minuti, secondi e millisecondi, anche se in genere ci si limita ai secondi, e spesso nemmeno a quelli. Utilizziamo questa forma solo a scopo didattico:

<script type="text/javascript">

<!--

  var data = new Date();
  var Hh, Mm, Ss, mm;
  Hh = data.getHours() + ":";
  Mm = data.getMinutes() + ":";
  Ss = data.getSeconds() + ":";
  mm = data.getMilliseconds() + ":";
  document.write("Sono le ore " + Hh + Mm + Ss + mm);

//-->

</script>

Per quanto semplice possa essere questo script è bene analizzarne i vari passaggi.

In primo luogo dichiariamo la variabile “data” come detto in precedenza, dichiariamo poi quattro variabili, una per ogni valore associato ed aggiungiamo come stringa il classico carattere di separazione dell’orario, i due punti (:), poi ricorriamo alla funzione document.write() per eseguire la stampa a video. Ecco il risultato:

Sono le ore 16:2:3:285

Allo stesso modo possiamo stampare a video i valori associati al giorno, al mese ed all’anno in formato gg/mm/aaaa, con una piccola particolarità per quanto riguarda il mese: l’interprete JavaScript conta i mesi da 0 a 11, quindi, per identificare il mese di Gennaio verrà utilizzato il numero 0.

Per rendere esatta la stampa a video, alla variabile associata al mese verrà addizionata una unità, dato che la data 12/03/1978 per l’interprete JavaScript equivale al 12 Aprile dell’anno 1978, ma il lettore la interpreterà come 12 Marzo. Addizionando l’unità alla variabile associata ai mesi, la stampa a video sarà 12/04/1978, equivalendo al 12 Aprile sia per l’interprete JavaScript sia per il lettore.

Vediamo un esempio:

<script type="text/javascript">

 <!--
  var data = new Date();

  var gg, mm, aaaa;
  gg = data.getDate() + "/";
  mm = data.getMonth() + 1 + "/";
  aaaa = data.getFullYear();
  document.write("Oggi è il " + gg + mm + aaaa);
 //-->
</script>

L’output di questo codice di esempio è il seguente:

Oggi è il 30/1/2018

utilizzando questa volta il carattere slash (/) come separatore tra i valori, più adatto alla visualizzazione della data.

document

L’oggetto document rappresenta il documento HTML

Alcuni metodi

  • document.write(“testo”) scrive nel documento
  • document.writeln(“testo”) scrive nel documento ed inserisce un ritorno a capo

Alcune proprietà

  • document.title titolo del documento
  • document.body elemento body del documento
  • document.images[ ] vettore delle immagini
  • document.links[ ] vettore dei link
  • document.anchors[ ] vettore dei segnalibri
  • document.forms[ ] vettore dei moduli
  • document.forms[x].elements[ ] vettore dei campi-modulo

Per tutti i vettori è disponibile la proprietà length per rilevare il numero degli elementi contenuti. Gli elementi dei vettori sono indicizzati a partire da 0.

Se agli oggetti (immagini, form, campi-modulo) sono stati attribuiti dei nomi (proprietà name) è possibile usare questi per farvi riferimento. 

document.getElementById("idElemento").value

document.getElementById("idElemento").value

value rappresenta il valore inviato con  GET o POST

  • può essere usato per l’input dagli elementi  “input”
  • può essere usata per l’output sugli elementi “input”caselle di testo

Esempio:
<form>
  <table>
    <tr><td><input type="text" id="nome1"/></td></tr>
    <tr><td><input type="text" id="nome2" disabled /></td></tr>
    <tr><td><input type="button" name="ok" id="btn_ok" value="Clicca qui" onclick="mostra()" /></td></tr>
  </table>
</form>
<script>
function mostra()
{

   var nome = document.getElementById("nome1").value;
   document.getElementById("nome2").value = "Ciao " + nome;
}
</script>

document.getElementById(“idElemento”).inner.HTML

document.getElementById(“idElemento”).innerHTML

  • innerHtml si applica a tutti gli oggetti che possono contenere HTML (div, span, ed altri) 

Esempio:

<p id="nome3"></p>

<script>
          var nome = "Mario";
         document.getElementById("nome3").innerHTML = "Ciao " + nome + "<br>";
</script>