>> SPEAKER 1: Nå i det siste eksempelet, husker at vi ispedd noen
Javascript-kode på innsiden av min HTML, spesifikt, på innsiden av verdien av
attributtet såkalte On Send for at formen tag.
Nå for små sider, dette er ikke så big deal.
Men som en web-side blir lengre og mer kompleks, er det bare å sette ditt
Javascript-kode her og der inne av verdien av attributtene ikke er
beste design.
Best hvis vi faktor det ut og minst sette den på innsiden av
skriptmerket sentralt.
>> Hvordan du gjør dette?
Vel la oss gå tilbake til formen min tag og først slette denne egenskapen og dens
verds helt.
Deretter opp her, i stedet for å definere en funksjon kalt Greet, la oss henge på
til linjen med kode som til syvende og sist vi vil fortsatt ønsker å utføre og erstatte
den Hils funksjon som følger.
Document.get Element Av ID sitere unquote demo -
hvor demo, husker, er den unike identifikator for selve skjemaet -
prikk på sender, som husker er navnet av hendelsesbehandling i hvilken
vi er interessert.
Og la oss tildele at på sende behandleren verdien som er faktisk en
fungere selv.
>> Nå merker at jeg er faktisk ikke å kalle en funksjon her.
Jeg er i stedet definere en anonym, ellers kjent som en lambda funksjon
ved å spesifisere mellom disse klammeparentes en haug med kode som skal
faktisk bli henrettet.
Nærmere bestemt, den koden som jeg ønsker å kjøre er den linjen som jeg hadde
før, og så la oss legge til at return false slik at denne formen er ikke
til slutt sendt til ende ekstern web server på den tradisjonelle måten.
>> La oss nå lagre denne filen, åpne den opp i en nettleser, og se hva som skjer.
http://localhost/dom-1.html.
La oss nå skrive i mitt navn, David, Submit.
Og ingenting ser ut til å ha skjedd bortsett fra nettadressen til siden min ser ut til å
har endret seg som om formen var faktisk levert til den samme filen.
>> Nå hvorfor kan det være?
Vel jeg trenger litt mer informasjon.
Så la oss gå videre og åpne opp Chrome Utviklerverktøy, slik at jeg kan faktisk
se på konsollen vinduet for å se hvis jeg har gjort noe galt.
Jeg kan få tilgang til via et par måter.
En av dem er via denne menyen her, deretter under Verktøy, deretter ned til
Utviklerverktøy.
>> Og legg merke til her i fanen Console, det er en uoppfanget typefeil, kan ikke
sette eiendommen på sender av null.
Nå hvorfor kan det være?
Vel tilbake i min kildekoden her, varsel som på sender jeg tror er en
eiendom av elementet som unik identifikator er demo.
Et element, igjen, er bare en node i et tre.
>> Så det ser ut til at nettleseren min ikke tror at dette elementet
eller node finnes ennå.
Og ja, det gjør det ikke.
Husker at en nettside analyseres eller lese av en nettleser, topp til bunn,
venstre til høyre.
Og så når Javascript-kode er oppstått, typisk, er det utført
med en gang.
>> Men i dette tilfellet, har vi ikke engang kommet ennå ikke den del av dom, i
HTML, hvor denne form med en unik identifikator demo har blitt erklært.
Og så vi prøver å kjøre min Javascript-kode før den noden selv
foreligger i treet som, selvfølgelig, i problematisk fordi da, sikkert,
elementet i seg selv vil være null på det tidspunktet.
>> Så hvordan å fikse?
Vel har vi et par løsninger.
Men la oss prøve det enkleste ved flytting min script tag fra hodet
merke til kroppen min, men spesifikt mot nederst på siden min kropp så
at det er under nodene og spørsmål.
Nærmere bestemt, la oss markere og klippe den åpne koden og tagg for script
og flytte det hele blokken med kode til bunnen av filen her.
>> Nå er dette ikke nødvendigvis den reneste designe, men minst vil det
håndheve den riktige rekkefølgen av operasjoner.
La oss lagre filen og oppdater i nettleseren min.
La oss laste siden på nytt, re-inngang mitt navn, og det er Hei David tilbake.