SPEAKER 1: Nu i det sidste eksempel, minde om, at vi afbrudt nogle JavaScript-kode inde i min HTML, specifikt inden for værdien af attribut kaldet On Indsend for denne form tag. Nu til små sider, dette er ikke sådan en big deal. Men som en webside bliver længere og mere kompleks, blot at sætte dit JavaScript-kode her og der inde af værdien af ​​attributter er ikke bedste design. Bedste, hvis vi faktor, ud og i det mindste sætte det inde i script-tag centralt. 

Hvordan du gør dette? Jamen så lad os vende tilbage til mit formular tag og først slette denne attribut, og dens værdsætter helt. Derefter op, end til at definere en funktion kaldet Greet, lad os hænge på til den linje kode, der i sidste ende vi vil stadig ønsker at udføre og erstatte funktionen Velkommen som følger. Document.get Element Af ID citere citat slut demo - hvor demo, husker, er det unikke identifikator for selve formularen - prik på indsende, som husker er navnet af arrangementet handleren, hvor vi er interesseret. Og lad os tildele den pågældende på indsende handleren den værdi, der er faktisk en fungere selv. 

Læg nu mærke til, at jeg faktisk ikke kalde en funktion her. Jeg stedet definere en anonym, ellers kendt som en lambda-funktion, ved at angive mellem disse krøllede parenteser en flok af kode, der skulle faktisk blive henrettet. Konkret den kode, jeg gerne vil at udføre, er, at linje, som jeg havde før, og så lad os føje til, at return false så denne formular er ikke i sidste ende forelægges ende remote web server på den traditionelle måde. 

Lad os nu gemme denne fil, åbne den op i en browser, og se hvad der sker. http://localhost/dom-1.html. Lad os nu skrive i mit navn, David Send. Og intet ser ud til at være sket undtagen webadressen på min side ser ud til at har ændret sig, som om formen var faktisk indsendes til samme fil. 

Nu hvorfor kan det være? Jamen jeg har brug for nogle flere oplysninger. Så lad os gå videre og åbne op Chromes Developer Tools, så jeg kan faktisk se på konsollen vinduet for at se hvis jeg har gjort noget forkert. Jeg kan få adgang til det via et par måder. Hvoraf den ene er via denne menu her, derefter under Funktioner, derefter ned til Developer Tools. 

Og bemærk her på fanen Console der er en ikke-fanget typen fejl, kan ikke sæt ejendom på indsende nul. Nu hvorfor kan det være? Nå tilbage i min kildekode her, varsel at der på indsende jeg synes er en egenskab af elementet, hvis entydig identifikator er demo. Et element, igen, er bare en knude i et træ. 

Så det lader til, at min browser ikke mener, at dette element eller node eksisterer endnu. Og ja, det gør det ikke. Husk på, at en webside analyseres eller læse af en webbrowser, top til bund, venstre til højre. Og så når JavaScript-kode er stødt på, typisk, det er henrettet højre væk. 

Men i dette tilfælde, vi har ikke engang fået endnu til den del af den frihed, det HTML, hvor denne form med en unik identifikator demo er blevet erklæret. Og så vi forsøger at udføre mit JavaScript-kode, før denne node selv eksisterer i træet, som naturligvis er problematisk, fordi da, helt sikkert, elementet i sig selv vil være nul på daværende tidspunkt. 

Så hvordan du løser? Nå vi har et par løsninger. Men lad os prøve den enkleste ved at flytte mit script-tag fra hovedet tag til min krop, men specifikt mod bunden af ​​min side krop så at det er under knudepunkterne og spørgsmål. Specifikt, lad os fremhæve og skære det åbne tag og tæt tag til script og flytte det hele blok af kode til bunden af ​​filen her. 

Nu er det ikke nødvendigvis den reneste designe, men i det mindste vil håndhæve den rigtige rækkefølge af operationer. Lad os gemme filen og reload i min browser. Lad os genindlæse siden, re-input mit navn, og der, Hej David er tilbage.