Javascript. HTML per definire il contenuto delle pagine web CSS per specificare il layout delle pagine web JavaScript per definire il comportamento delle.

Presentazione sul tema: "Javascript. HTML per definire il contenuto delle pagine web CSS per specificare il layout delle pagine web JavaScript per definire il comportamento delle."— Transcript della presentazione:

1 Javascript

2 HTML per definire il contenuto delle pagine web CSS per specificare il layout delle pagine web JavaScript per definire il comportamento delle pagine web Javascript: linguaggio di programmazione

3 JavaScript è il linguaggio di programmazione per HTML – Accedere agli elementi HTML – Cambiare il valore di un attributo HTML – Cambiare gli stili – Rimuovere/Aggiungere elementi e attributi HTML – Gestire eventi in una pagina HTML Javascript: cosa possiamo fare?

4 DOM standard per l’accesso ai documenti Definisce: – Gli elementi HTML come oggetti – Le proprietà degli elementi HTML – I metodi per accedere agli elementi HTML – Gli eventi per tutti gli elementi HTML HTML DOM (Document object model)

5 JavaScript può essere utile per: – Leggere/Modificare una proprietà di un elemento HTML es. modificare l’HTML di un paragrafo – Validazione di un input form es lunghezza di una stringa maggiore di 6 caratteri – Visualizzare del contenuto dinamico in una pagina es. Visualizzare il risultato di una operazione – Gestione di eventi onChange, onClick, onLoad,...onChangeonClickonLoad Javascript: esempi

6 – JS Window JS Window – JS Screen JS Screen – JS Location JS Location – JS History JS History – JS Navigator JS Navigator – JS Popup Alert JS Popup Alert – JS Timing – JS Cookies Browser object model (BOM)

7 Si può accedere agli elementi di una pagina: tramite il suo id tramite il tag name tramite la classe Si può accedere agli elementi di un oggetto es. un form HTML DOM (Document object model)

8 Esercitazione 4  Aprite la cartella js  Aprite il file LeggiEmodifica.html con il browser e con NotePad  Visualizzare il saluto in un popup (alert(...))  Aprite il file valida.html con il browser e con NotePad  Modifica la funzione js in modo tale che visualizzi un messaggio di errore se l’input è superiore a 10 caratteri

9 Esercitazione 4  Aprite il file somma.html con il browser e con NotePad  Modifica la funzione js in modo tale che calcoli la moltiplicazione di due numeri, al posto della somma  Aprite il file CambiaFoto.html con il browser e con NotePad  Modifica la funzione FotoPiccola in modo tale che setti la larghezza dell’immagine a 350px, dopo aver caricato l’immagine