1
00:00:00,000 --> 00:00:00,380

2
00:00:00,380 --> 00:00:03,000
>> SPEAKER 1: Ora in questo ultimo esempio,
Ricordiamo che abbiamo intervallati alcuni

3
00:00:03,000 --> 00:00:07,170
Il codice JavaScript all'interno del mio HTML,
specificamente, all'interno del valore di

4
00:00:07,170 --> 00:00:10,460
l'attributo chiamato On Submit
per quel tag form.

5
00:00:10,460 --> 00:00:12,850
Ora per piccoli pagine, questa
non è un grande affare.

6
00:00:12,850 --> 00:00:15,950
Ma come una pagina web diventa più lungo e più
complesso, semplicemente mettendo il vostro

7
00:00:15,950 --> 00:00:19,660
Il codice JavaScript qua e là dentro
del valore di attributi non è l'

8
00:00:19,660 --> 00:00:20,830
miglior design.

9
00:00:20,830 --> 00:00:23,440
Meglio se teniamo conto che fuori e
almeno mettere dentro di

10
00:00:23,440 --> 00:00:25,200
il tag script centralmente.

11
00:00:25,200 --> 00:00:26,080
>> Come fare questo?

12
00:00:26,080 --> 00:00:30,040
Bene torniamo alla mia tag forma e
innanzitutto eliminare questo attributo e la sua

13
00:00:30,040 --> 00:00:31,780
valore del tutto.

14
00:00:31,780 --> 00:00:35,730
Poi qui, piuttosto che definire una
funzione chiamata Greet, cerchiamo di appendere su

15
00:00:35,730 --> 00:00:39,405
alla riga di codice che alla fine si
sarà ancora voglia di esecuzione e sostituire

16
00:00:39,405 --> 00:00:41,560
la funzione Greet come segue.

17
00:00:41,560 --> 00:00:48,190
Document.get Element By ID
citare demo unquote -

18
00:00:48,190 --> 00:00:52,410
dove demo, ricordo, è l'unica
identificatore per il modulo stesso -

19
00:00:52,410 --> 00:00:56,600
puntino su submit, che ricordo è il nome
del gestore eventi in cui

20
00:00:56,600 --> 00:00:57,710
siamo interessati.

21
00:00:57,710 --> 00:01:01,990
E si assegni che su submit handler
il valore che è in realtà un

22
00:01:01,990 --> 00:01:03,740
funzione stessa.

23
00:01:03,740 --> 00:01:06,390
>> Ora noto che io non sono in realtà
chiamare una funzione qui.

24
00:01:06,390 --> 00:01:10,650
Sto invece la definizione di un anonimo,
altrimenti noto come funzione lambda,

25
00:01:10,650 --> 00:01:14,100
specificando tra le parentesi graffe
un mucchio di codice che dovrebbe

26
00:01:14,100 --> 00:01:15,490
effettivamente eseguito.

27
00:01:15,490 --> 00:01:18,500
In particolare, il codice che mi piacerebbe
da eseguire è quella linea che ho avuto

28
00:01:18,500 --> 00:01:23,370
prima, e poi aggiungiamo a tale
return false in modo che questo modulo non è

29
00:01:23,370 --> 00:01:26,950
in ultima analisi, presentata alla fine web remoto
server nel modo tradizionale.

30
00:01:26,950 --> 00:01:30,345
>> Vediamo ora salvare il file, aprirlo
in un browser, e vedere cosa succede.

31
00:01:30,345 --> 00:01:33,050

32
00:01:33,050 --> 00:01:39,800
http://localhost/dom-1.html.

33
00:01:39,800 --> 00:01:43,060
Vediamo ora digitare nel mio nome,
David, Submit.

34
00:01:43,060 --> 00:01:46,900
E nulla sembra essere successo
tranne l'URL della mia pagina sembra

35
00:01:46,900 --> 00:01:52,580
hanno cambiato, come se la forma era
effettivamente presentate nello stesso file.

36
00:01:52,580 --> 00:01:53,870
>> Ora, perché potrebbe essere?

37
00:01:53,870 --> 00:01:55,340
Beh, ho bisogno di qualche informazione in più.

38
00:01:55,340 --> 00:01:58,700
Quindi cerchiamo di andare avanti e di aprire Chrome
Strumenti per gli sviluppatori in modo che possa effettivamente

39
00:01:58,700 --> 00:02:01,440
guardare la finestra della console per vedere
se ho fatto qualcosa di sbagliato.

40
00:02:01,440 --> 00:02:03,330
Posso accedere a tale via
un paio di modi.

41
00:02:03,330 --> 00:02:07,250
Uno dei quali è tramite questo menu qui,
quindi in Strumenti, poi giù per

42
00:02:07,250 --> 00:02:08,509
Strumenti per gli sviluppatori.

43
00:02:08,509 --> 00:02:12,890
>> E notare qui nella scheda Console,
c'è un errore di tipo non rilevato, non può

44
00:02:12,890 --> 00:02:15,390
impostare la proprietà a presentare null.

45
00:02:15,390 --> 00:02:16,900
Ora, perché potrebbe essere?

46
00:02:16,900 --> 00:02:21,380
Bene nel mio codice sorgente qui, avviso
che su Invia credo sia un

47
00:02:21,380 --> 00:02:25,360
proprietà dell'elemento cui
identificatore univoco è demo.

48
00:02:25,360 --> 00:02:27,810
Un elemento, di nuovo, è solo
un nodo in un albero.

49
00:02:27,810 --> 00:02:30,870
>> Così sembra che il mio navigatore non
pensare che tale elemento

50
00:02:30,870 --> 00:02:32,500
o il nodo esiste ancora.

51
00:02:32,500 --> 00:02:33,790
E in effetti, non è così.

52
00:02:33,790 --> 00:02:37,690
Ricordiamo che una pagina web viene analizzata o letto
da un browser web, dall'alto verso il basso,

53
00:02:37,690 --> 00:02:38,430
da sinistra a destra.

54
00:02:38,430 --> 00:02:41,810
E così quando il codice JavaScript è
incontrato, in genere, è eseguito

55
00:02:41,810 --> 00:02:42,700
subito.

56
00:02:42,700 --> 00:02:46,460
>> Ma in questo caso, non abbiamo ancora ottenuto
ancora la parte del dom, l'

57
00:02:46,460 --> 00:02:51,100
HTML, in cui tale forma con un unico
identificatore demo è stata dichiarata.

58
00:02:51,100 --> 00:02:54,320
E così stiamo cercando di eseguire il mio
Il codice JavaScript prima di quel nodo ancora

59
00:02:54,320 --> 00:02:58,530
esiste nella struttura che, naturalmente, è
problematico perché allora, sicuramente,

60
00:02:58,530 --> 00:03:01,390
l'elemento stesso sarà nullo
a quel punto nel tempo.

61
00:03:01,390 --> 00:03:02,390
>> Quindi, come risolvere?

62
00:03:02,390 --> 00:03:03,810
Beh, abbiamo un paio di soluzioni.

63
00:03:03,810 --> 00:03:07,200
Ma proviamo il più semplice da trasferire
la mia tag script dalla testa

64
00:03:07,200 --> 00:03:11,560
tag al mio corpo, ma in particolare, verso
la parte inferiore del corpo di mia pagina così

65
00:03:11,560 --> 00:03:14,170
che è al di sotto dei nodi
e le domande.

66
00:03:14,170 --> 00:03:19,930
In particolare, cerchiamo di evidenziare e tagliare
il tag di apertura e chiusura tag per copione

67
00:03:19,930 --> 00:03:24,720
e trasferire tutto quel blocco di codice
alla fine del file qui.

68
00:03:24,720 --> 00:03:27,690
>> Ora, questo non è necessariamente il più pulito
progettare, ma almeno lo farà

69
00:03:27,690 --> 00:03:29,530
rispettare il giusto ordine delle operazioni.

70
00:03:29,530 --> 00:03:31,495
Salviamo il file e
reload nel mio browser.

71
00:03:31,495 --> 00:03:34,620

72
00:03:34,620 --> 00:03:40,240
Facciamo ricaricare la pagina, reinserire il mio nome,
e là, Ciao David è tornato.

73
00:03:40,240 --> 00:03:42,784