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

2
00:00:00,380 --> 00:00:03,000
>> SPEAKER 1: Nå i det siste eksempelet,
husker at vi ispedd noen

3
00:00:03,000 --> 00:00:07,170
Javascript-kode på innsiden av min HTML,
spesifikt, på innsiden av verdien av

4
00:00:07,170 --> 00:00:10,460
attributtet såkalte On Send
for at formen tag.

5
00:00:10,460 --> 00:00:12,850
Nå for små sider, dette
er ikke så big deal.

6
00:00:12,850 --> 00:00:15,950
Men som en web-side blir lengre og mer
kompleks, er det bare å sette ditt

7
00:00:15,950 --> 00:00:19,660
Javascript-kode her og der inne
av verdien av attributtene ikke er

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

9
00:00:20,830 --> 00:00:23,440
Best hvis vi faktor det ut og
minst sette den på innsiden av

10
00:00:23,440 --> 00:00:25,200
skriptmerket sentralt.

11
00:00:25,200 --> 00:00:26,080
>> Hvordan du gjør dette?

12
00:00:26,080 --> 00:00:30,040
Vel la oss gå tilbake til formen min tag og
først slette denne egenskapen og dens

13
00:00:30,040 --> 00:00:31,780
verds helt.

14
00:00:31,780 --> 00:00:35,730
Deretter opp her, i stedet for å definere en
funksjon kalt Greet, la oss henge på

15
00:00:35,730 --> 00:00:39,405
til linjen med kode som til syvende og sist vi
vil fortsatt ønsker å utføre og erstatte

16
00:00:39,405 --> 00:00:41,560
den Hils funksjon som følger.

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

18
00:00:48,190 --> 00:00:52,410
hvor demo, husker, er den unike
identifikator for selve skjemaet -

19
00:00:52,410 --> 00:00:56,600
prikk på sender, som husker er navnet
av hendelsesbehandling i hvilken

20
00:00:56,600 --> 00:00:57,710
vi er interessert.

21
00:00:57,710 --> 00:01:01,990
Og la oss tildele at på sende behandleren
verdien som er faktisk en

22
00:01:01,990 --> 00:01:03,740
fungere selv.

23
00:01:03,740 --> 00:01:06,390
>> Nå merker at jeg er faktisk ikke
å kalle en funksjon her.

24
00:01:06,390 --> 00:01:10,650
Jeg er i stedet definere en anonym,
ellers kjent som en lambda funksjon

25
00:01:10,650 --> 00:01:14,100
ved å spesifisere mellom disse klammeparentes
en haug med kode som skal

26
00:01:14,100 --> 00:01:15,490
faktisk bli henrettet.

27
00:01:15,490 --> 00:01:18,500
Nærmere bestemt, den koden som jeg ønsker
å kjøre er den linjen som jeg hadde

28
00:01:18,500 --> 00:01:23,370
før, og så la oss legge til at
return false slik at denne formen er ikke

29
00:01:23,370 --> 00:01:26,950
til slutt sendt til ende ekstern web
server på den tradisjonelle måten.

30
00:01:26,950 --> 00:01:30,345
>> La oss nå lagre denne filen, åpne den opp
i en nettleser, og se hva som skjer.

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
La oss nå skrive i mitt navn,
David, Submit.

34
00:01:43,060 --> 00:01:46,900
Og ingenting ser ut til å ha skjedd
bortsett fra nettadressen til siden min ser ut til å

35
00:01:46,900 --> 00:01:52,580
har endret seg som om formen var
faktisk levert til den samme filen.

36
00:01:52,580 --> 00:01:53,870
>> Nå hvorfor kan det være?

37
00:01:53,870 --> 00:01:55,340
Vel jeg trenger litt mer informasjon.

38
00:01:55,340 --> 00:01:58,700
Så la oss gå videre og åpne opp Chrome
Utviklerverktøy, slik at jeg kan faktisk

39
00:01:58,700 --> 00:02:01,440
se på konsollen vinduet for å se
hvis jeg har gjort noe galt.

40
00:02:01,440 --> 00:02:03,330
Jeg kan få tilgang til via
et par måter.

41
00:02:03,330 --> 00:02:07,250
En av dem er via denne menyen her,
deretter under Verktøy, deretter ned til

42
00:02:07,250 --> 00:02:08,509
Utviklerverktøy.

43
00:02:08,509 --> 00:02:12,890
>> Og legg merke til her i fanen Console,
det er en uoppfanget typefeil, kan ikke

44
00:02:12,890 --> 00:02:15,390
sette eiendommen på sender av null.

45
00:02:15,390 --> 00:02:16,900
Nå hvorfor kan det være?

46
00:02:16,900 --> 00:02:21,380
Vel tilbake i min kildekoden her, varsel
som på sender jeg tror er en

47
00:02:21,380 --> 00:02:25,360
eiendom av elementet som
unik identifikator er demo.

48
00:02:25,360 --> 00:02:27,810
Et element, igjen, er bare
en node i et tre.

49
00:02:27,810 --> 00:02:30,870
>> Så det ser ut til at nettleseren min ikke
tror at dette elementet

50
00:02:30,870 --> 00:02:32,500
eller node finnes ennå.

51
00:02:32,500 --> 00:02:33,790
Og ja, det gjør det ikke.

52
00:02:33,790 --> 00:02:37,690
Husker at en nettside analyseres eller lese
av en nettleser, topp til bunn,

53
00:02:37,690 --> 00:02:38,430
venstre til høyre.

54
00:02:38,430 --> 00:02:41,810
Og så når Javascript-kode er
oppstått, typisk, er det utført

55
00:02:41,810 --> 00:02:42,700
med en gang.

56
00:02:42,700 --> 00:02:46,460
>> Men i dette tilfellet, har vi ikke engang kommet
ennå ikke den del av dom, i

57
00:02:46,460 --> 00:02:51,100
HTML, hvor denne form med en unik
identifikator demo har blitt erklært.

58
00:02:51,100 --> 00:02:54,320
Og så vi prøver å kjøre min
Javascript-kode før den noden selv

59
00:02:54,320 --> 00:02:58,530
foreligger i treet som, selvfølgelig, i
problematisk fordi da, sikkert,

60
00:02:58,530 --> 00:03:01,390
elementet i seg selv vil være null
på det tidspunktet.

61
00:03:01,390 --> 00:03:02,390
>> Så hvordan å fikse?

62
00:03:02,390 --> 00:03:03,810
Vel har vi et par løsninger.

63
00:03:03,810 --> 00:03:07,200
Men la oss prøve det enkleste ved flytting
min script tag fra hodet

64
00:03:07,200 --> 00:03:11,560
merke til kroppen min, men spesifikt mot
nederst på siden min kropp så

65
00:03:11,560 --> 00:03:14,170
at det er under nodene
og spørsmål.

66
00:03:14,170 --> 00:03:19,930
Nærmere bestemt, la oss markere og klippe
den åpne koden og tagg for script

67
00:03:19,930 --> 00:03:24,720
og flytte det hele blokken med kode
til bunnen av filen her.

68
00:03:24,720 --> 00:03:27,690
>> Nå er dette ikke nødvendigvis den reneste
designe, men minst vil det

69
00:03:27,690 --> 00:03:29,530
håndheve den riktige rekkefølgen av operasjoner.

70
00:03:29,530 --> 00:03:31,495
La oss lagre filen og
oppdater i nettleseren min.

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

72
00:03:34,620 --> 00:03:40,240
La oss laste siden på nytt, re-inngang mitt navn,
og det er Hei David tilbake.

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