La presentazione è in caricamento. Aspetta per favore

La presentazione è in caricamento. Aspetta per favore

INTRODUZIONE A JAVASCRIPT Cos’è? Perché si usa? Come si usa? ? ! Come interagisce con HTML? ?

Presentazioni simili


Presentazione sul tema: "INTRODUZIONE A JAVASCRIPT Cos’è? Perché si usa? Come si usa? ? ! Come interagisce con HTML? ?"— Transcript della presentazione:

1 INTRODUZIONE A JAVASCRIPT Cos’è? Perché si usa? Come si usa? ? ! Come interagisce con HTML? ?

2 PER NAVIGARE SUL WEB bisogna conoscere un principio fondamentale:

3 MODELLO CLIENT/SERVER CLIENT WEB SERVER URLINTERNET

4 PERCHE’ USARE JAVASCRIPT?

5 …per arricchire le pagine HTML …per dargli una “logica” …per inserire dinamicità...per inserire funzionalità … per permettere l’INTERAZIONE tra l’UTENTE e il WEB

6 controllare la validità dei dati inseriti nei form fornire messaggi di avvertimento o risposte alle scelte effettuate gestire le finestre del browser gestire eventi che possono accadere durante la consultazione delle pagine, provocati dall’utente con il click del mouse eseguire calcoli matematici sui valori inseriti dall’utente CONTROLLO - GRAFICA - CALCOLO

7 L’azienda che ha avuto l’idea di creare un vero e proprio linguaggio per inserirlo dentro una pagina HTML è stata NETSCAPE. Inizialmente creò un linguaggio che si chiamava Livescript, poi ribattezzato in Javascript Javascript nasce a metà degli anni ’90 per un motivo ben preciso: scrivere applicazioni sia sui server Web e sia sulle pagine HTML dei client. In realtà la parte server non ha mai avuto una grande diffusione, mentre tutt’oggi la quasi totalità dei browser supporta questo linguaggio all’interno delle pagine HTML. UN PO’ DI STORIA …

8 COS’E’ JAVASCRIPT? E’ UN LINGUAGGIO DI SCRIPTING LATO – CLIENT ? SCRIPTING

9 LATO - CLIENT …perché JavaScript viene eseguito sul nostro computer dal browser Questa differenza perché ci sono anche alcuni linguaggi di scripting come asp,php, perl che vengono eseguiti dal web server: si chiamano pertanto linguaggi lato server (o server side). OSS: Pertanto ciò che scriviamo ha validità solo all’interno delle singole pagine web, e non da una pagina all’altra.

10 SCRIPTING … perché la sintassi JavaScript possiamo scriverla direttamente dentro la pagina HTML, senza bisogno di produrre alcun file compilato. Possiamo visualizzare in qualsiasi momento il codice di una pagina HTML e leggere le righe di sintassi JavaScript. … è un linguaggio interpretato: non esiste nessun compilatore, ma è direttamente il browser, che legge le parti di codice (script) JavaScript e quindi le esegue sulla macchina client.

11 COME INSERIRE IL CODICE? Per scrivere la sintassi si utilizzano i tag: e così: istruzioni Oggi si usa l’attributo type al posto di language

12 DOVE INSERIRE IL CODICE? 1.Inserire il codice JavaScript nel documento fra i marcatori Primo esempio

13 2.Inserire il codice JavaScript nel documento fra i marcatori Ancora un esempio di JavaScript

14 3. Caricare il codice JavaScript da un file esterno Il file esterno ha estensione “.js” e viene richiamato all’interno della pagina html in questo modo:

15 Ancora un esempio… Terzo esempio di script Ecco il classico esempio

16 … COMMENTI Possono scriversi su di una riga con l'utilizzo dei simboli // o su più righe tra i simboli /* e */. //Questo è un commento su una sola riga /* Questo è un commento su più righe. Questa è la seconda riga. Questa è l'ultima riga. */ I commenti sono un ottimo modo per fornire un contesto al nostro codice. E’ importante commentare in fase di scrittura perché ci costringe a riflettere sulla logica.

17 COME FA JAVASCRIPT AD INTERAGIRE CON L’HTML? DOM (Document Object Model) E’ un modello ad oggetti con cui JavaScript gestisce le pagine, interagisce con il browser Web, usando metodi e proprietà di alcuni oggetti fondamentali. Serve per identificare in modo preciso i vari elementi HTML e le relative proprietà.

18 Oggetti del Browser Navigator History Location Document

19 Gli Oggetti sono in relazione gerarchica tra loro Il DOM può essere rappresentato come un albero Ciascun nodo è identificato da un oggetto I collegamenti tra i nodi rappresentano la relazione padre/figlio con cui è possibile navigare history location document window forms[]images[]links[] Finestra corrente aperta nel browser

20 OGNI OGGETTO HA DELLE PROPRIETA’ E DELLE FUNZIONI (METODI) OGGETTO1.PROPRIETA’1 Per accedere alle proprietà e alle funzioni usiamo la notazione.dot OGGETTO1.METODO1(arg1,…argN) Esempio: document.title (rappresenta il titolo della pagina) document.URL (recupera l’url del documento)

21 FUNZIONI DELL’OGGETTO WINDOW window.alert() mostra un messaggio pop-up all’utente window.confirm() mostra una casella di conferma (si/no) con l’utente window.prompt() mostra una casella di dialogo con l’utente window.open() apre una nuova finestra del browser

22 FUNZIONI DELL’OGGETTO DOCUMENT document.write():serve per scrivere direttamente all’interno della pagina Web document.open(): apre un documento per scrivervi all'interno document.close():chiude il documento dopo che è stato aggiornato

23 PROPRIETA’ DELL’OGGETTO DOCUMENT document.URL: contiene l’url del documento document.title: contiene il titolo della pagina attiva desunto dal contenuto compreso tra i due tag e ; document. lastModified :contiene la data dell’ultima modifica della pagina


Scaricare ppt "INTRODUZIONE A JAVASCRIPT Cos’è? Perché si usa? Come si usa? ? ! Come interagisce con HTML? ?"

Presentazioni simili


Annunci Google