ALLISON Buchholtz-AU: Rendben mindenkinek. Üdvözöljük a szakaszt. Ez a mi utolsó előtti szakaszt. Olyan szomorú. Nem tudom, mit fogok csinálni anélkül, hogy látta a srácok minden hétfőn. Azt hiszem, meg kell Csak-- Talán csak Itt találkozik egy vacsorára, vagy valami. Nem tudom. Hozok ételek helyett. Majd csak beszélni. De igen, a jövő héten lesz az utolsó szakaszt. Ezen a figyelmét, hogy van egy kvíz jövő héten. Tudom, elfelejtettem, hogy nem az én, mint, Két héten előzetes értesítés a múlt héten, de remélhetőleg srácok tudta, hogy ez jön. Remélhetőleg ez az egyik az utolsó midterms a srácok a félévben. De ez meg fog terjed ki az összes anyagot, hogy eljutottunk fölött. Tehát ez nem tetszik akkor csak felejtsd Körülbelül négy hurkok és változók. Mert megtudtuk azoknak az elején, ezek nyilvánvalóan fair játékot a kvíz. 

Ez lesz az azonos formátumban, ugyanazon hosszát, így már vannak szokva. Ott lesz kódolási kézzel problémák, talán néhány igaz hamis, talán néhány rövid válasz. Így kell ismeri a formátumot, különösen akkor, ha figyelembe A gyakorlati teszteket. De ahogy itt mondják, hogy ez kumulatív, de mi határozottan fog koncentrálni, dolgokat héten hat kezdve. Tehát valószínűleg nem fog kérdezném, hogy hány bájt van az egyes típusú vagy azok a dolgok, de mi valószínűleg lesz érdekel a dolgok, mint láncolt listák, vagy különböző adatstruktúrákból vagy különböző algoritmusok hogy beszéltünk. Úgyhogy győződjön meg róla, hogy tényleg fel azokat, és ha szükséged forrásokat, itt a sok erőforrást. Én csak adtam neked kedves Egy rövid lista van. 

Jövő héten lesz kvíz felülvizsgálja ez idő alatt. Tehát, ha bármilyen kérdése van vagy konkrét témákról, konkrét dolgokat a kvíz, hogy szeretnél menni mint, kérjük, küldje el nekem előre az időben, így tudok fajta készítsen néhány anyag, hogy. És ezen túlmenően szakasz felülvizsgálatát, akkor is tartja a tanfolyam-szerte felülvizsgálja mint tettük azt legutóbb. És ez lesz által ugyanazon emberek. Nem tudom, ha ez teszi, hogy jobb vagy rosszabb, de ez lesz velem, Hannah, Davan, és Gabe újra. Tehát, ha azt szeretnénk, hogy jöjjön látni mindannyiunkat ugratás egymással és végigvezeti kvíz felülvizsgálatot, akkor feltétlenül jönni, hogy jövő hétfőn is. Szóval akkor csak meg hétfőn jam csomagolt kvíz felülvizsgálata, ami jó mert akkor kedd feldolgozni keresztül mindent. 

De biztosan nem ellenőrzi meg ezeket a forrásokat. Study.csv.net messze, I gondol, az egyik a leghasznosabb, leginkább azért, mert van Sok minta kódját, azt minden hatalom pont az összes jegyzetek rajta, amelyek igazán az, amit felhívni a legtöbb Az én területem anyagok. Ha van valami a korábbi szakaszok hogy én is küldtem hogy lehet, hogy nem ütött, csak szóljatok. Mint a múlt heti minta kódját, Ha valaki nem kapta meg, csak e-mailt nekem, vagy jöjjön beszélni velem, és én győződjön meg arról, hogy kapsz, hogy. 

Tehát az, hogy ma megyünk hogy beszél a JavaScript. Tehát itt vagyunk Tommy, aki voltam, csak beszélgetek veled tegnap este. Szeretem Tommy. JavaScript a kedvenc nyelvet, mint mondja itt. Megpróbálják, és mondd meg, hogy ez az nem a legjobb, és rossz lesz. Szóval Tommy egy JavaScript mester. Nem vagyok az ő szinten, de én, mint "Tommy, hogyan tanítok ezek a gyerekek JavaScript? " Szóval van néhány tipp, így remélhetőleg dolgoznak ki. 

Tehát egy pár dolgot tudnunk kell, hogy A JavaScript kliens-oldali script nyelv, így míg PHP valami hogy mi tekinthető több szerver oldali, azt feltölteni a szerverre, összeállította és végrehajtásánál. Ez az egyik kivégzett a saját gépünkön. OK? Szóval a terhelés egy JavaScript oldalon, és végrehajtja a gépen. Szintaxis nagyon hasonlít a C és a PHP. Megyünk végig Néhány példa a JavaScript, és fogsz látni, hogy a Így beszélünk változók, hurkok, és feltételek mind nagyon hasonlóak. OK? Az a tény, hogy annyira hasonló a valószínűleg meg is old néhányan közületek fel, bizonyos esetekben, csak azért, mert akkor bele egy kicsit a C ahol nem kellene. Lehet, hogy próbálja meg és írj be valami ha nem kell leírni. 

És azon, egy dolog, hogy tudom, hogy a JavaScript van egy dinamikus típusú nyelv, mint a PHP. Tehát, ha a srácok emlékezni szakasztól a múlt héten, amikor mi voltunk a fajta csinál a PHP gyorstalpaló, láttuk, hogy a húr egyik lehet vált egy int egyetlen, és így tovább. A típus a változók határozzák futási időben, így is változhat a során a program, és ugyanúgy, hogy soha nem Tényleg kijelentem típus használata PHP változók, mi lesz ezzel azonos dolog itt, ahol vagyunk, nem igazán ellenőrzése a tipusú változók, hogy úgy mondjam, mint mi a C. 

És akkor egy dolog hogy elég hűvös van hogy lehet hiba keresztül ellenőrizze a konzol, Ezzel a nagy funkcióval console.log, amely lehetővé teszi, hogy nyomtassa ki a különböző változók vagy tárgyak, hogy mi lesz beszéljünk. Csakúgy, mint a múlt héten, amikor én voltam mint "használja ezt a funkciót," a lerakó az Ön PSET ez a funkció használni kívánt, console.log. Annyira meglepődtem, hogy hány hallgatók hivatali munkaidőben Nem tudni a dump funkció. És én, mint "srácok, ez az akarat hogy az élet így sokkal könnyebb. " 

Rendben, hogy kedves volt Csak egy rövid dolog, mint mindig, van példa. Tudom, hogy ti is szeretik azokat. Tehát itt egy példa egy nagyon egyszerű JavaScript fájl van. Szóval ez csak létre fog hozni ez a pop-up, amely azt mondja, "Hello world", amikor írjuk be az oldal, de most megpróbál járni ezen keresztül egy kicsit. Természetes tehát, hogy ez csak mint a normál index.html. Szóval, csak a normál sablont innen, és mi van HTML, Megvan a fej, és mint a CSS, hogyan benne valami külső fájlt, ugye? Van néhány script type szöveg, amely JavaScript. És a forrás hello.js, ami itt lent. Ez az egész fájlt a hello.js. És akkor mi van némi Cím és néhány szervezet HTML hogy nem igazán érdekel. 

Mi történik az, hogy mikor betölteni az oldalt, automatikusan végrehajtja ezt a forgatókönyvet. OK? Tehát JavaScript automatikusan végrehajtásra. Tehát mit fog csinálni, ez lesz hogy azonnal menjen, és végre ezt. És ez meg fog mondani, hogy "éber. Hello world. " Amelyek figyelmeztetik a funkciót, hogy valóban létre ezt a dobozt. OK? Szóval ez a fajta minden felölelnek. Nincs semmi extra volt csinálni mellett csak éber, majd, amit csak akarunk a mi Alert mezőbe. OK? Szóval ez csak egy szuper egyszerű Például, hogy mi JavaScript tehet. 

Az egyik nagyon klassz dolgokat, mint látni fogjuk, az, hogy a JavaScript segítségével manipulálni a weboldalakat, anélkül, hogy helyezze vissza minden alkalommal. Tehát, ha want-- például, ha Ön lebeg valamit, ha a srácok valaha láttam, mint a menüsorok, vagy ha lebeg át néhány Téma, egy legördülő menü jelenik meg, hogy azért, mert a JavaScript. OK? Szóval nem újratöltés az egész oldalt kap Ebben a menüben jelenik meg, csak keres valami konkrét akció, hogy a felhasználó megtette, amelyek úgynevezett események szerzünk a, és ha látod, hogy azt mondod, "OK, szerkeszteni valamit ebben a oldal és azt a látszatot különböző, de csak szerkeszteni ezeket a konkrét dolgokat. Ne töltse be újra az egészet. " Így valójában sokkal szebb, és Önnek nem kell újratölteni a lapokat, és ez nagyon klassz. 

Szóval változó nyilatkozatok, így egyfajta lásd, Tettem a tetején van, lazán gépelt. Tehát ez nagyon hasonlít a PHP. Nem kell mondani JavaScript milyen típusú vagyunk vár minden ilyen változók. Lehetnek bármilyen típusú akarunk. Tehát azt veszi észre, ebben az esetben, kinyilvánítjuk őket nagyon egyszerű, csupán a "var" majd, amit csak akarunk a változó neve legyen. Egy dolog megjegyezni, hogy ha tedd var előtt egy változó neve, e helyben tár meg. OK? Ez teljesen ésszerű az Ön számára hogy teljesen igazságos törli a var és csak s egyenlő CS50, és hogy ez csak egy globális változót. OK? Szóval lehet inicializálni ez mindkét irányban, Csak attól függ, hogyan szeretné azt. Tehát, ha inicializálása ez egy függvényen belül, és azt szeretné, hogy változó maradj távcsöves belül ilyen funkciót, fogsz akar csinálni olyasmi, mint var name változó, versus ha azt akarjuk, globálisan távcsöves, akkor csak csinálni a nevét A változó majd amit szeretne, hogy egyenlővé tenni. OK? 

Ez elég jó dolog itt lenn, mert ha azt vesszük észre, mi változót b indul ki, mint igaz. És mi ez a does-- lehet valaki mondja meg, mit is csinál ez? Így van némi figyelmeztetés. Mi lenne típusa b legyen az elején? Közönség: logikai. ALLISON Buchholtz-AU: logikai. Jobb. És akkor mi átrendelhet b hogy ez a szöveg, ugye? Szóval akkor itt, milyen b lenni? Jó lenne egy string, ugye? Szóval mi a fontos észre, hogy a c, akkor Szinte soha nem valami ilyesmi. Mi volna, hogy egy változót, öntött rá, mint valami más, Talán nem néhány funkció a két i, megy a töltés egész. De ha azt vesszük észre, itt, b nagyon könnyen változik írja. 

Közönség: Várj, így csak lenni, mint, "hogy b egész szám?" 

ALLISON Buchholtz-AU: Igen. Tudod csak átminősítése b egészre. 

Közönség: Tényleg? 

ALLISON Buchholtz-AU: Igen. És akkor lenne egy int. Tehát a változók változhat A program során a túl. Ezek nem feltétlenül gépelt. Ez nagyon gyengén típusos. OK? Alapvetően a változók csinálsz, amit akarnak, mint mi fajta látta a PHP. Megtehetik őrült dolgokat, így ezért fontos, hogy legyen elég óvatos. Adjon nevet a változók is. Ha nem teszed, hirtelen fogsz lenni, mint, "Várj, azt hittem ez a húr, és most ez egy int, és nem vagyok egészen biztos benne, mi folyik itt. " Tehát ez csak egy egyszerű példa bemutatja, hogyan változtatható könnyen megváltoztatni a típusát fölött A tanfolyam a program. 

OK. Tehát ez kell nézni szuper, szuper ismerős. Tehát ezek a hurkok JavaScript. Ezek pontosan ugyanaz, kivéve Négy helyett int i nullával egyenlő, tudnánk mondani var i nullával egyenlő. És akkor mi lehetett volna a ugyanaz a fajta A feltétel, ugyanaz a fajta frissítés i plus plus működik, csak finom. Tehát négyes ugyanaz, mindaddig ugyanaz, és nem whiles pontosan ugyanaz. Ugyanaz a fajta általános formája. Mi észre, négy, zárójelben, zárójelben, ez mind ugyanaz. Szintén ott lesz a pontosvessző ha eljutunk a példa kód. Látni fogod, hogy elég nagyjából ugyanaz, mint a C. 

A működés nyilatkozatok, ismét, nagyon hasonló. Van valami funkciója, hogy csak azt mondja, hogy ez a funkció, majd A neve a mi funkciót, és a bemenet. És újra, ha azt vesszük észre, mi Nincs típusú itt sincs. Ugye? Nekünk semmi mondván, hogy ezek a kell ints vagy páros, vagy úszik. Ők lehetnek, amit akarnak. Ami fontos megjegyezni, hogy meg kell írni a funkció előre hogy hagyja JavaScript tudni, hogy ez valójában egy funkciót. 

Tehát ez csak néhány egyszerű összege függvény, amely visszaadja az x vagy y, és akkor mi is hűvös az, hogy ténylegesen jelölhet ki egy funkciót változó. Tehát ebben az esetben, összeg most a funkció, amely valójában nem összeget. Tehát, ha megemlítem, van funkciót, nevét funkció, bemenet. Ugye? Itt már csak meg működését és bemenetek. Ezért hívják egy névtelen függvényt. És ez a valami, legyen az új a legtöbb srácok, ha nem mind. Tehát alapvetően ez az azt jelenti, hogy mi nem meg kell neveznie a mi funkció ebben az esetben. Mi is csak azt mondja: "OK, megyek van ez a funkció, amely végrehajtja, itt a felhasználásával, és itt mit fog csinálni. " És főleg ha éppen kiosztása a funkció bizonyos változó hogy fogsz manipulálni, Nem feltétlenül meg kell neveznie, mert akkor leszel utalva hogy ez a változó által nevet és nem bármilyen A funkció tulajdonképpen az úgynevezett. OK? 

Tehát, ha itt látunk, akkor Van néhány változó összeget most , amely egyenlő a összege három-öt. És mi lenne, hogy ezt. És ez csak egy kis figyelmeztetés, Három plusz öt számával egyenlő. Ez a plusz majd csak összefűzni bármi legyen a válasz az volt rá a húr. Szintén jó, plusz lehet összefűzni szálakat. 

A JavaScript mint a PHP, HTML, CSS és ahogy mondta, sok is Mi vagyunk a fajta figyelembe A képzés kerekek le itt és a srácok sok a know hogyan kell igazán értem ezeket a dolgokat. Ők kicsit más, de ők nem olyan külföldi és hogy van nem a Google a dolgokat, vagy nézni őket online w3 iskolákban. És mi nagyon vártalak srácok, milyen, kísérlet és tanulni a saját. Szóval, tudom, hogy ez úgy tűnik, egy kicsit kevesebb alapos mint néhány, a C dolgok mi, de ez valójában az oka. De remélhetőleg ez nem túl különböző, és ez nem nyomasztó. 

Tehát a tömbök JavaScript, megint nagyon, nagyon hasonló. Ugye? Van néhány változó tömb ez egyenlő az üres szerelvényeket, és ez csak egy üres tömböt. Ezt gyakran nevezik szó tömb jelöléssel. Ez csak egy dolog hívjuk. Ha látjuk tömb két itt van néhány szó tömb három eleme van, ugye? És akkor mi van némi var harmadik elem, hogy az Néhány változó, amely csak fog tartani ez a húr, JS. 

Az elemek, jó észrevenni, vesszővel elválasztva, csakúgy, mint várnánk. És akkor is hozzáférjen ezekhez, mint mi C-ben ez a mutató jelölés, igaz? Annyira különbözik a PHP Most, megyünk vissza hogy csak ilyen hivatkozással a dolgokat index. Csakúgy, mint a C, ez is nulla index. Úgy érzem, mintha lenne nagyon kegyetlen ha hirtelen történik JavaScript egyet index, és ha kellett, hogy teljesen újragondoljuk, mit gondol a tömbök. 

Az egyik fontos dolog az, hogy ahelyett, kelljen do-- ha valaha akarta, hogy a hossza a tömb, Lehet, hogy halad végig, hogy amíg nem talál valami vége, vagy akkor csak azt tudom, hogy mi az. Mert JavaScript nagyon laza több módon, mint írja, mint amit itt látunk, tudjuk csak, hogy ez array nagyobb, mert úgy döntünk, hogy. Ha azt vesszük észre, tömb három Három dolgot kezdeni, de aztán hirtelen, Olyanok vagyunk, mint, "Ó, csak vicceltem. Mi történt valójában annak érdekében, hogy a 101 dolog. " Tehát, ha valaha is szeretne tudni a tényleges hossza a tömb, akkor ezt teszem. És mi lesz, hogy egy csomó Az ezt a jelölést a példák, de JavaScript ez általában bármilyen objektum, amiről te beszélsz dot bármilyen fajta funkció alkalmazni szeretne rá. OK? 

Tehát ebben az esetben, a mi objektum tömb két, és azt mondjuk, szeretnénk, ha a hossza tömb két. Tehát ez csak kéri, mint hossza rajta. És, hogy visszaadja a hossza. Még valami megjegyezni, hogy ha azt vesszük észre, mi tömbök, ellentétben a C, nem rendelkeznek hogy az összes azonos típusú. Ez sokkal, mint a PHP. JavaScript alapvetően ugyanúgy, mint ezt az érdekes meld a C és a PHP. Szóval ezzel is foglalkozom. Mert most, nézzük csak feltételezni hogy a tömbök alapvetően mint a C tömbök, hogy ezek nulla indexelt. OK, így minden. Azt is csak meghosszabbítja a array, hogy bármilyen index akarsz. Mivel ez valószínűleg seg hibája, akkor vagy ad egy kis hiba, JavaScript, mint, "nah, ez rendben van. Majd én. Majd csak egyenesen ahol akarsz. " 

OK, így a tárgyak nagyon fontos. Srácok, lesz egy csomó ilyen a P halmaz, ha jól emlékszem. Tehát a dolog, hogy ezek hasonló a C-ben struktúrákat. Így gondolja about-- ha megyünk egy példát jobb Ezek után azt hiszem, ez hogy sokkal több sense-- de alapvetően használt tárgyak szervezni természetesen a kapcsolódó információkat. Amikor beszélgettünk Struktúrák a C, gyakran beszélni egy diák, aki volt néhány nevet, ID, ház, tudod, a koncentráció. És ez a fajta ugyanezt hogy az általunk használt tárgyak itt. Ez csak szervezni hasonló információkat. 

Azt is gondolom, ilyen például a több hasonló asszociatív tömbök a PHP. Ez lenne tehát a fajta dolog ahol van néhány kulcsfontosságú néhány érték, nagyon hasonlít a PHP. Szóval lehet inicializálni néhány Üres objektum, mint látjuk itt, Csak kapcsos zárójelek. Tehát tömbök szögletes zárójelben. Üres tárgyak kapcsoszárójele. Jó különbséget, hogy van. És ezek csak két különböző módon lehet beállítani tulajdonságait. Tehát ez a fajta sokkal inkább úgy, hogy hasonló a PHP, a mi asszociatív tömbök, a mi legfontosabb, és mi érték, míg ez ez-- azt is megtudhatod lásd ebben sokkal több a JavaScript. Ez szokott lenni az egyezmény. És ugyanúgy, hogy megcsináltuk tömb két pont hossza, ezt mondván: "OK, add nekem ezt attribútum az objektum. " Ugye? Tehát ugyanúgy volt, mint, "adj Az attribútum hossza tömb két, " ez azt mondja, "adj egy kis tulajdonának üres objektumot. " Vagy ebben az esetben, mi hozzárendelésével valamilyen értéket. De akkor is elérheti ez így. 

És akkor itt van ez csak amelyen két különböző figyelmeztetéseket. Tehát ez azt mutatja, a riasztások lenne az pontosan ugyanaz, ez csak két különböző módon hozzáférés az elem, amit akar. Van ennek értelme mindenki számára? Úgy érzem, ez az egyik Valószínűleg több értelme, csak azért, mert mi megyünk ki a PHP. De, mint mi több példát, ezt a van szó pontosan ugyanaz. A sok ez csak megváltoztatni a szintaxis. 

OK, így példát. Szeretem példákat. Íme tehát néhány CS50 változó, amely egy objektum, és mi Store Ez információt róla. Tehát van persze, oktató, TFS, psets, és ragasztószalaggal. Tehát azt látjuk, ezek szinte minden különböző típusú. Ugye? Tehát tárgyak tárolására attribútumok különböző típusú. Azt is gondolom, this-- nagyon hasonló a mi asszociatív tömb PHP. Tehát kulcs, érték, kulcs, érték, kulcs, érték, így tovább és így tovább. Mi is érdekes, ugyanúgy hogy mi lehet a tömbök tömbök, Mi is van tárgyak tárgyak, vagy tömbök tárgyakat. Te soha nem korlátozódik Csak egyetlen egy dolog. Mi lehet kapni nagyon Inceptionesque, csak menj le a nyúl lyuk van. 

Tehát, ha azt vesszük észre, mi Van néhány persze, hogy egy karakterlánc, oktató, hogy egy húr, és tömb, int, és a logikai. Ezért az összes ilyen különböző dolog. 

Rendben, igen, van egy másikat. Tehát ebben az esetben, van egy sor tárgyakat. Szóval, csak úgy, mint egy tárgyat lehet egy tömb benne. Mi is van egy sor tárgyakat. Ez hasznos lehet gondolni hasonló jellegű hogyan volt egy hash asztal, volt egy tömbben Ezen különböző típusú struktúrákat, hogy voltak mutatókat különböző csomópontok és miegymás. De ebben az esetben, mi Van egy sor tárgyakat. Tehát ez olyan, mint egy tömb Az asszociatív tömbök. Így van némi első eleme lenne tárgya lehet a neve James és a ház Winthrop. 

Talán még emlékeztek valami nagyon hasonló ehhez Ön az utolsó PSET, ahol, ha húzta valamit az adatbázisból, Az első fajta dolog a tömb volt az összes információt Az első felhasználó, hogy találkoztam vele, és akkor kellett index be, hogy hogy az állomány, vagy a gyorsítótárat vagy miegymás. Tehát ez egy nagyon hasonló dolog, csak egy kis változás szintaktikai, kicsit megváltozott A szavakat használunk leírni őket. 

Tehát ha azt akartuk, valaki meg tudja mondani nekem, hogy mi ez a figyelmeztetés lenne itt csinálni? Vagy mi ez a darabka kódot tenne nekünk? Közönség: Ez fogok adni mindent a nevét. ALLISON Buchholtz-AU: Jobb, így is csak figyelmezteti az összes nevét mert akkor megy át vendégház i, így azt nulláról indulnak. Tehát azt mondanám, OK keresünk Ebben az első tárgy, amely az első slot a tömbben. És azt mondja, "add nekem a attribútum, a neve annak a tárgyat. " Így megy itt, mi lenne scan, mi lenne megtalálni nevet, és mi volna kinyomtatni James, Molly, és Carl. Bármilyen kérdése eddig? JavaScript sajnos fogsz lenni a sok keresi fel a Saját, kitalálni a szintaxis, küzdenek vele. De persze mindig itt vagyok, Munkaidő mindig itt. Lehet, hogy kedden a héten. Tehát, ha ott vagy, akkor Jöjjön el velem ezen a héten. Ez nagyszerű lenne. 

OK, így DOM Document Object Model-. Tehát ez csak egy módja hogy szeretjük azt hinni, hogyan HTML és mindent belül szerveződik. Ez nagyon valami, biztosan előkerül a kvíz. Tudom én évem, olyan volt, mintha itt HTML fájlt, töltse ki a DOM érte. És csak töltse ki a kis dolgokat. Ezek legyen könnyű pontokat remélhetőleg. Remélhetőleg csak-- 

Közönség: [hallható] 

ALLISON Buchholtz-AU: Tehát látod ezt a fát itt? 

Közönség: Igen. 

ALLISON Buchholtz-AU: Tehát akkor kérni használata kitölteni, mi megy a szervezetben. Talán a test alatt, van néhány divs vagy van néhány bekezdésben, és megkérjük, hogy töltse ki egy fa nagyon hasonlít erre. Így fogunk járni rajta. Tehát a Document Object- Modell csak egy módja hogy rendszerezze és szerintem a mi HTML grafikus. És azt is, amikor megkapjuk a több JavaScript, ez lesz a hogy mi valójában manipulálják a különböző elemek az oldalon. Szükségünk van egy módja annak, hogy hozzáférést egyes A dolgok a mi HTML, és így ez ad nekünk egy nagyon beton szabványosított módon szerte különböző weblapok erre. 

Tehát, ha csak séta ennek itt természetesen a dokumentum olyan, mint a teljes fájlt. Ez nyilvánvalóan van értelme hogy ez a legnagyobb dolog, és akkor mi van a tényleges HTML, amely megfelel ennek a címke itt. Akkor is, ha a francia a címkéket megfelelően, akkor létre ezt a DOM fában válik végtelenül egyszerű. Így van némi feje van. Van néhány szerv, látjuk szár le HTML, ezért is van fej és a test. Ezen belül a fejét, van néhány title tag, véget cím tag, így tudjuk, hogy utána jön a fejét. És a mi tag címet, mi hello, világ. OK? Szóval ez az egész bal oldali ága. Majd a jobb oldali ág Itt azt látjuk, hogy mi HTML, OK tettünk ezen a fejrész, keresünk, csak a test, így van némi testfelület. Ezen belül az egyetlen dolog, amink van, hello, világ. OK? Ha voltak dolgok, mint Néhány konzol p majd hello, világ, majd egy másik konzol p a búcsút, világ, mi lett volna, két buborék jön le itt. Mert ők mind a test alá, de ők külön bekezdések ebben az esetben. Kétségkívül gyakorlatban azon a korábbi vetélkedők, valamint számos on-line rajta. OK, így ez csak lehetővé teszi, lássuk mindent szépen és manipulálni a dolgokat Nagyon módszeresen. OK? Pontosan tudjuk, hogyan kell bejárására át ezt a fát, így tudjuk, hogy mit akarunk elérni. 

OK, így ez miért akarunk hogy ez a fajta modellt, hogy ki tudjuk használni a dolgokat, mint ez, és megértjük, mit jelent, és ők szabványosított minden dolog, hogy csinálunk. Tehát dokumentum dot cím csak címmel our-- mindezen elég magától értetődő, Szeretném azt hinni,. Tehát az első három példák csak azt mondom, "OK, csak add nekem a címe ennek a web oldalon. " Tehát akkor kapsz, amit megfelel a cím. 

Dokumentum dot testet fog adni bármit, ami az említett szervezet címkék. Szóval lehet manipulálni, hogy. És a dokumentum dot test dot HTML kódot egy nagyon klassz egyet, és talán nem, mint a Super intuitív, de a belső HTML Ennek megfelelő itt. Tehát, ha valaha is szeretne manipulálják a szöveget egy oldalon, jellemzően fogsz csinálni valamit test dot belső HTML. OK? Tehát a belső HTML hajlamos lásd ami valójában címkék között. OK? És akkor hasznos funkciókat. Tehát, ha akart ezek közül bármelyik, bármely elemét, van néhány Id, class név, vagy a tag nevét. Ez nagyon hasonlít a dolgokat tettünk CSS, ugye? Hol van néhány választók, hogy felelnek meg sem a tag, egy osztály hogy adunk nekik, vagy Id. Ez nagyon hasonló módon. Ha van valami, ami van néhány osztálya kutya, és azt mondod, hogy elemeket a tag nevét, és teszel kutya there-- vagy sajnálom, osztály nevét. Tudod, hogy pont ott. Meg fog visszatérni az összes ilyen elemek nektek, hogy van az osztályban. Szóval lehet manipulálni csak azokat. Ugyanígy, talán csak amit módosítunk néhány fejléc, így Néhány H1 fejléc, mint mi. Lehet nem kap elemek tag nevét, mert H1 tag nevét. És ugyanúgy, ha azt akarjuk, hogy néhány egyedülálló dolog, amit tehetünk get tag. Get elemet Id. És igazából sok ilyen. Ezek csak, mint három nagyon sok. Tehát, ha megy online, mint Megyek, hogy ösztönözze hogy nem, és némi kutatás a saját, Azt ajánlom, vizsgálja az összes ilyen. Ők lehetnek super hasznos, különösen akkor, ha Szeretnéd csak ilyen manipulálni nagyon különleges dolgot, anélkül, megy keresztül, és próbálja kiszűri azokat mindent. 

OK, így az utolsó dolog, a JavaScript eseményeket. Tehát, ha én beszélek korábban arról megy rá egy weboldalt, és amikor fölé viszi valamit, vagy mutat az egérrel valamit, valami más történik. Ez az, amit szeretnénk gondolni, mint egy esemény. Szóval mi van, amelyek Hasznos itt onclick. Így az enyém volt a hover, ami vagyok elég biztos, csak a hover. Szintén egy csomó ilyen hogy meg lehet keresni. Van egy egész lista Online A különböző dolog hogy meg lehet hallgatni az. 

De JavaScript események alapvetően csak reagál a dolgokra hogy a felhasználó csinál. Ugye? Így a felhasználó nem valamit, ami egy esemény, és JavaScript válaszol Azonban azt szeretné, hogy. Ez lesz reagálni kell. Tehát ebben az esetben, van Néhány ablak dot berakás. Szóval mi ez mond, hogy "várj amíg az ablak be lett töltve. " OK? Tehát amikor minden betöltött, berakás, akkor ezt a funkcióját. Tehát amikor minden betöltött, fogsz hogy néhány keresési gombot hogy lesz egy elem által Id, és nyomtat bármit is elem, mint a Keresés gombra. És akkor itt van ez a változó, azt mondjuk, "OK, onclick." Tehát amikor azt halljuk egy kattintás A keresés gombra, A funkció végrehajtása, ami egy éber, akkor kattintott a Keresés gombra. 

Tehát mi történik ez-- ez egy szép kis grafikus ábrázolása itt. Tehát mi dokumentumot terhelés, ez a mi berakás, találunk a keresési gombot, amely ennek. Keresünk a Keresés gombra. És akkor, amikor a keresés gomb kattint, a megfelelő itt. Onclick. Aztán végül figyelmezteti a felhasználót, amely ezt az utolsó sort itt. OK? Tehát minden egyes ilyen négy lépésben csak megfelel a négy doboz ott az alján. Van ennek értelme mindenki számára? 

És akkor egy dolog, hogy én csak fog beszélve, nagyon, nagyon röviden, hogy én Javasoljuk, hogy a srácok menj nézd inkább az, jQuery, amely csak egy könyvtár épül, amit a tetején JavaScript. Ez szuper hasznos, mivel A legtöbb könyvtár. Sok a funkciók. Szóval, ha van valami, ami valaha akarsz csinálni a JavaScript, Az első ösztöne nem kell arra gondolni, A "milyen funkciót kell Én írom? "Meg kell, "Hadd lássam valaki már megtette ezt nekem. " Mivel kilenc alkalommal tízből, valaki megtette már, és valószínűleg csinálhatta volna jobban. Az emberek töltenek sok időt csinál ilyen, és JavaScript igen széles körben használják, így az emberek állandóan próbálják jobbá tenni. És jQuery van egy csomó funkció hogy valószínűleg hasznos az Ön számára a projekt záró ha végeztek semmilyen web design. Ahogy mondani szoktam, "munka okosabb, sem nehezebb. " Ha a srácok csinálni, akkor lesz jó. Amikor mi vagyunk a hackathon én nem azt akarom, hogy minden hangsúlyozta ki. Azt akarom, hogy tetszik, "Kaptam ez az. jQuery kaptam vissza. Nem kell írni ezeket a funkciókat. " 

Tehát csak két dolog emlékezni fogok hogy hagyja srácok, hogy inkább a jQuery saját. Minden fogom mondani, hogy nem néhány elég félelmetes dolgokat és lehet, hogy az életed az egész sokkal könnyebb. De mit szeretne Van olyan, amit fájl hogy fogsz használni azt a, fogsz szeretné ezt a két vonalat. Fogsz szeretné, hogy a script a js jQuery dot js. És valóban a forrás lesz néhány URL. Ha a Google jQuery, Google valóban ad otthont a fájlokat az Ön számára. Szóval feltétlenül akar input hogy URL helyett. Én csak tette ezt ide az egyszerűség kedvéért. Mindez azt jelenti, hogy hol megtalálja a jQuery könyvtár. Ez hatalmas, így nem szeretné, üzemeltetheti a saját számítógépén Ha tudod elkerülni, ezért is hajlamosak csak fel a Google URL-t házigazdák ezeket a fájlokat az Ön számára. OK? Ön a Google is, ígérem ott lesz. 

És akkor bármit JavaScript fájlt, hogy te használva, így ez csak néhány külső JavaScript fájlt használ. Ugyanígy, hogy összekapcsoljuk a CSS fájlokat, ez ugyanaz a fajta dolog. Ez csak hivatkozások a fájl ahol a JavaScript van. És van néhány példa egyszerű JavaScript. Így lesz megy át rajta. És akkor az index JavaScript, amely a JavaScript fájl van, ez a fajta a wrapper hogy van a jQuery. Már majdnem 99,9 százaléka az idő megy hogy ezt a index.js fájlt. Mert ami akkor ezzel azt is, "Nem hajt végre semmit amíg a dokumentum valójában kész ", ami pontosan mit szeretne. Mert ha a dokumentum nem áll készen, és jQuery kezdi csinálni a dolgokat, ez csak a rendetlenség. Szóval azt szeretné, hogy ezt a wrapper. Majd a dolgok, hogy menjen oda, én el kell hagynia a srácok saját böngészte. 

OK, így van-e kérdésekre jobbra most körülbelül JavaScript általában? Vagy a DOM modell? Ha nem, van néhány klassz példák, hogy mi mehet át, hogy a srácok segíthet kódot. De én is lesz szuper szép, és ha Nem akarok mondani semmit e, hogy rendben. Én is csak ad példát. De semmit a PowerPoint, mielőtt továbbmegyünk? Cool. 

Úgy érzem srácok kell az energia. Szóval azt hiszem, fogunk kezdeni A pártom például először. Van három példát, van választásod. Tehát van az óra, hogy hová megyünk végrehajtására tényleges órajel ez frissítünk az idő múlásával. Van ez a nagy Twitter funkciót. This-- tudod mit, várj. Megyünk, hogy ez menni. BAM-hoz. OK. 

Van ez a nagy Twitter funkció Itt, hogy-- tudom, ugye? Ez jó lesz. Srácok izgatott? Hogy fog számolni a A karakterek nem engedélyezte, Tehát, ha azt írja most, Nyilvánvalóan még mindig azt mondja 140, de tudjuk, hogy nem ez a helyzet. Majd az utolsót Itt, kattintson ide bulizni. Mi fog történni, ha kattintunk, a háttérben a fog változtatni a színeket. Szóval srácok a lehetőségeket a melyiket akarod először. Ígérem, hogy nagyon könnyű neked. Úgy érzem, mindenki kedves A mindössze nagyon alacsony kulcs ma. Szóval én majd végigvezeti, hogyan mi hajtja végre az összes ilyen. Ha azt szeretnénk, hogy csipogásához a, ez nagyszerű, de én úgy érzi, mintha mindenki egy kicsit fáradt. Szóval én csak járni, keresztül ezek a példák. Van-e valami, hogy szeretnénk csinálni először? Bárki? Nincs preferencia? OK. Tudod, mit? Mi vagyunk a párt. Úgy érzem srácok szüksége little-- igen, mi nem a párt egyik első. OK. 

Szóval mi van here-- ez Nem kellett volna ott lennie. Most már jó. OK. Tehát mi van itt van csak egy egyszerű HTML oldal hogy a srácok kell mind super ismeri a legutóbbi két psets. Megvan a doc típusú itt. Lehet, hogy mindenki látja? OK. Cool. Megvan a HTML nyilván. Van néhány fejléc, amely kapcsolódik a stíluslapok, hogy csak tettem font szép és nagy és merész. Szóval ne aggódj. 

Van néhány szerv, Egy Id háttér, OK? Mert mi lesz a változó a háttér. Tehát, ha változtatjuk a háttérben a testünk, emlékezünk a két héttel ezelőtti ha van dolgunk weboldalakat. Olyan jó, hogy van. És van néhány Id egyenlő félnek. Ez h ref font csak azt jelenti, hogy ez fog menni ugyanazon az oldalon. És kattintson a bulin, ezért amikor kattintson rá, meg kell változtatni a színeket, szerencsére. 

És akkor mi van néhány script, hogy itt csak kapcsolódik ez a párt dot js fájl, hogy üres, hiszen mi nem tettünk semmit. És ez annyira szomorú. De nagyon hamar, ez meg fog változni színek, és ez lesz félelmetes. 

Szóval én csak fog járni srácok révén hogyan lehet megközelíteni ezt. Tehát az első dolog, hogy azt érdemes csinálni, ha változnak a háttérben A test, az első dolog, amit érdemes tennie, hogy valóban megragad mi a test, ugye? Tehát azt akarjuk, hogy összeget, a háttér, és ha azt veszi észre, Én csak automatikusan csak elkezd gépelni. Nincs semmi különös, hogy mi annyi a teendőnk, hogy a JavaScript fájlokat. Kezdhetem nyilvánította változók, és kijelentette random funkciók. És ez sokkal több szabad formában. Ez olyan, mint a C, adtunk meg minden E kemény szabályokat, és nőtt fel, így vagyunk, mint a "menj tovább. Legyen ingyenes. Csinálj, amit akarsz. " És ez az, amit JavaScript van. Így van némi háttér itt. A mi DOM modell, tudjuk, tehetünk a dokumentum dot kap eleme, és ha azt vesszük észre, itt, testünk egy id. Ugye? Így nem tehetünk, hogy a dokumentum a Id, és itt egy egyszerű. Mi a Id hogy szeretnénk itt? Közönség: Háttér. ALLISON Buchholtz-AU: Háttér. Tökéletes. És pontosvessző végén. Hogy nem múlt még el. Továbbra is szükség lesz pontosvessző. OK. Szóval ez a mi első. És amikor kattintson valamit, amit szeretnénk, hogy történjen valami, igaz? Tehát érdemes lehet változó hogy vár egy kattintással. Mit fogunk csinálni a fogunk hogy mi linkre jobban hasonlít egy gombot. Szóval lesz egy kis gomb, egyenlő dokumentálja dot kap elemet Id. És ha én beszélek kattintson linket, vagy kattintson a bulin link, mi lehet az én Id itt? Party. Helyes. OK nem túl rossz eddig. Mindenki azt kapja, amit csinálunk? 

OK, így most már a gombra, és szeretnénk dolgok megváltoztatására, amikor kattintson rá. Tehát, ha arra gondolunk, a mi PowerPoint, nagyon egyszerű dolog, amit tehetünk csak gombra dot onclick, ugye? És ez megy, hogy egyenlő néhány funkciója. Ez egy névtelen függvény. És ez csak as-- valóban én vagyok hogy vége egy kicsit nagyobb. 

Tehát mi én csináltam Itt van mondok, OK, amikor kattintson a gombra, ami Ez a kapcsolat, hogy mi csak említett, fogunk végrehajtani ez a névtelen függvény. Nem kell-e nyersanyagot. Nem érdekel, hogy a felhasználó mit mond. Amikor kattintson rá, mi vagyunk csinálni, amit akarunk, amely megváltoztatja a háttér színét. OK? Szóval ezért nincs semmilyen bemenet, már csak ez a névtelen függvény. És most tényleg lesz hogy megírjam ezt a funkciót. 

Szóval van egy csomó módon meg megoldására egy véletlenszerű színt. Úgy, ahogy én csináltam az volt, hogy generál három véletlen számokat és hogy azokat az RGB hármas. Szóval ez csak azt mutatja, néhány hűvös dolog, hogy ha te, mint: "Ó, Meg kell állítani egy véletlenszerű száma. "Ha a Google-azt, ez az, amit Ön is megtalálja. 

Tehát van három különböző dolgokat, var, nem piros megint zöld. Ugye? Tehát ezek a három dolog, hogy egy színt. Kék, vörös és zöld. Cool. És mit tehetünk, hogy tudjuk, hogy között kell lennie, 255, és ha felnézett néhány véletlenszám-generátor, Ön is kap valamit, mint a matematika dot random, amely, ha megnézi ezt fel visszatér néhány számot nulla és egy között. OK? És milyen számok tőlünk RGB háromágyas mennek között? Zero és mit? Mit lehet felmennek? 255. Tehát ha a matematika dot random megy nulla és egy között, hogyan lehet szeretnénk konvertálni ezt? Közönség: Idő? ALLISON Buchholtz-AU: Igen, pontosan. Így az idő 255. 

Közönség: [hallható] Ez olyan, mint [hallhatatlan]. ALLISON Buchholtz-AU: Math dot véletlen. Közönség: Cool. ALLISON Buchholtz-AU: Igen. JavaScript csak úgy vigyáz rád. OK. Így nem tehetünk, hogy az összes ilyen. Ugye? Math dot véletlenszerű időpontokban 255. Értettem. Cool. Szóval az a helyzet, ez lehet Nem tér vissza egy egész szám. Ugye? Talán egy kis száma nulla és egy között, és azt okozza azt, hogy kissé off, és mi RGBS nem lehet úszik. Kell, hogy ints. Tehát, ha próbálkozott ezzel, akkor azt valószínűleg Van néhány kiszámíthatatlan viselkedése. Lenne egy kis funky. Mi tehát az, azt akarjuk, hogy arról, hogy ezek le vannak kerekítve, és akkor lehet kerekíteni mindkét irányban. Megkerültem a padlón. Úgyhogy mindig gondoskodott arról, hogy lefelé kerekítve. De megy ki, hogy milyen egyszerű is az volt, hogy csak kap egy véletlen számot, Ön szerint hogyan vagyunk talán emeleti ezt a számot? Ez nagyon hasonlít. Valami ötlet? Tehát, ha véletlen volt, csak matematikai dot véletlenszerű, így gondolsz tennénk emeleten? Math dot emeleten. És akkor is ezt math dot mennyezetre. Kerek a fajta kétértelmű mert nem tudni, hogy a kerek fel, vagy lefelé kerekítve. Tehát általában mindig nem matematikai dot emeleti, matematikai dot mennyezet. De honestly-- 

Közönség: Vajon emeleti fordulóban le? 

ALLISON Buchholtz-AU: Emelet lefelé kerekít. És ez még csak a választás a részemről. 

Tehát most már a három szám amelyeket véletlenszerűen generált, és mit fogunk tenni most is mi vagyunk csak fogja változtatni a hátteret. OK? Tehát már a háttérben a fajta tárolt ezen elemében nevű háttérben. Tehát mi, észre fogod venni, ha akkor játszottam körül ezt meg akarjuk változtatni a stílusát. És ez a fajta dolog, akkor a Google és kitalálni, mint például hogyan kell változtatni a színét. 

De ahogy hozzá színe háttérben dot stílusban dot háttér. Tehát ez azt mondja adni ez a tárgy, a háttér, amely arra utal, hogy Elem ID ott, fogunk nézni a stílusban a stílus, fogunk nézd meg a háttérben. OK? És ha elmész, és nézd ezt fel, ez lehet, hogy egy kicsit több értelme, de ez alapvetően csak azt mondom, "Add nekem ezt a nagyon különleges tulajdonsága arról, amit korábban meghatározott. " Tehát mi változtatjuk meg, hogy az Néhány RGB, mert van értelme. Mi vagyunk a RGB háromágyas, ugye? És mi have-- azt szeretnénk, hogy győződjön meg arról, I hogy a megfelelő számú idézetek itt. Mi tehát a mi RGB, és megyünk to-- ez olyan, mint összefűzés, ami vörös. És akkor szeretnénk néhány vesszőt. És akkor azt akarjuk, valamint a zöld, majd néhány vessző, néhány kék. 

Tehát ezek a plusszok csak értem, mint összefűzése. Tehát ez csak létre ezt a húr, hogy megy belül RGB. OK? 

Közönség: [hallható], plusz majd A zöld plusz majd a piros. 

ALLISON Buchholtz-AU: Igen, mert elrontotta, hogy felfelé. Hogy az ember jól van. Oh, várj. Nem. Mert én kell győződnie arról, hogy kaptam ezeket a jogot. Tehát ki fogom fejteni uno momento. Zöld, kék, tökéletes. Most kész vagyok. Azt hiszem. 

OK. Szóval, mi ez, az, hogy háttere lesz állítva, néhány szöveg. Ugye? Melyik az, amit mi van itt. Ez lesz néhány RGB 255 vesszővel 255 vesszővel nulla, vagy bármi szám van ott. Tehát itt csinálunk, van néhány húr. És mit akarunk csinálni, mi vagyunk fajta dinamikusan létrehozza hogy amikor valóban a program futtatásához. Szóval ez a néhány szöveg. Plus összefűzi azt az értéket, amely a pirosnak, amely fűz össze azt egy vesszőt, ami összefűzi meg azzal, amit a zöld, és így tovább, és így tovább. OK? Amíg a legvégén, ami a záró zárójel ennek RGB itt. OK? 

Szóval mi ez fog generál némi parancsot igazán vagyis RGB három szám Ilyen körülmények készen áll a kijelölt. OK? Lássuk, ha ez működik. Remélem, ez így van, mert ha Nem, én leszek igazi szomorú. Ó, nem. OK, tartsd. Határozottan háttér dot stílusban dot háttér. Én biztosan hiányzik valami csak kicsi. Ugye srácok utálnak, hogy? Amikor ez csak egy kis apró hiba? Mindenható háttérben. RGB. 

Közönség: [hallható] ALLISON Buchholtz-AU: No. Megpróbáltam ezt a osztály előtt. Én mindent megtettem, mielőtt osztály esetén voltam, mint, "Várj, mit csináltam rosszul?" Mert én, mint "Én valószínűleg rendetlenség ezt fel valamikor. " Valamint a zöld. Minden úgy néz ki, mintha összefűzött helyesen. OK. 

Közönség: [hallható] 

ALLISON Buchholtz-AU: Ó, tessék. Ez az, amit szükség. Nézd meg ezt. Tiffany megmentésére. Tökéletes. OK. Most lássuk, hogy működik. Ó, Istenem. OK. Várj. 

Közönség: Space után a második plusz. 

ALLISON Buchholtz-AU: Melyiket? Ó, várj, várj. Tér kopás? 

Közönség: Second plusz A zöld összefűzése. ALLISON Buchholtz-AU: Oh. Közönség: most nincs hely miután a plusz, igen. ALLISON Buchholtz-AU: You Nem kell, hogy de- Közönség: Ó, te nem? ALLISON Buchholtz-AU: Úgy néz ki elég. Közönség: OK. OK. 

ALLISON Buchholtz AU: Lássuk, ha ez működik. OK. Én természetesen ennek hiányában a ez a demó, ami eszembe jut Az előadást a héten, de tudom, hogy ez működni fog. Tudom, hogy ez működni fog. Olyan közel. Hacsak nem véletlenül törölt én script ez. Nem, ez fél dot js. OK tartsa. Megyek másolni ezt, és én is vagyok csak fogja törölni mindent, mert volt ez a munka korábban. 

Ígérem, hogy működik. Ha nem, akkor megmutatom, mit Tommy is. És ott. 

Közönség: Te hivatkozó fél dot CSS, és ez egy fél pontot js. 

ALLISON Buchholtz-AU: Ah, nos itt a party dot js. OK, mit csináltam másképp? OK, majd meglátjuk, ha ez működik most. BAM-hoz. Szóval, nem tudom, mit csináltam másképp, de ez mi történjen. Kicsit hűvös. Rákattintottam ez, mint, örökre. De mi lehet próbálni, és mit csináltam másképp, hogy ez az egy volt. Nem tudom, ti hogy vagytok vele, de ez úgy néz ki, alapvetően mi írtam. Valószínűleg volt egy hiányzó pontosvessző valahol az én világom. Igazából után, azt hiszem, hiányzik pontosvessző itt valójában. De nem láttam, mert ez volt a képernyőről. 

De ha azt vesszük észre, ez elég sokkal pontosan mit írtam. Azt hiszem, talán a legnehezebb az egészben ez csak egyfajta ezt a dolgot Itt, a megértés mit csinál ott. Ezek a fajta dolog, amit tanulni tényleg csak egy Google-keresés és őszintén csak próbál. Ha úgy gondolja, van valami attribútum, akkor valószínûleg. Szóval próbáld ki. Meglátjuk, mi történik. Mint mondtam, van egy csomó kísérletezés JavaScript, és PHP, és minden, ami cucc, és CSS különösen. Ez az egyetlen igaz úgy érthetjük meg. 

OK, így fiaskó után a párt dot js, van két másik lehetőség. Van órát vagy a Twitter. Mindketten érdekes. Talán nem annyira szórakoztató, mint párt, amelyek egy jó kis strobing a dolog végére. Srácok bármilyen előnyben? Közönség: Clock? ALLISON Buchholtz-AU: Clock? OK. Cool. 

Tehát újra, mi van a üres JavaScript fájlt. És mint látjuk itt, Van néhány nagyon egyszerű HTML. Megvan a stíluslapok, hogy csak formátumok, mit kell kinéznie. Megvan a div Az azonosító órára, ami Csak azt mondja, "ez egy órát." És mi van a linket hogy a JavaScript fájl Ez tulajdonképpen fog generál a clock számunkra. Mivel a cool dolog, hogy akkor állítsa JavaScript automatikusan frissül maga. OK? Tehát ahelyett, hogy várja a felhasználói hogy elérje Refresh egy oldalon így lehet kapni frissített időben, JavaScript frissíthető azonban szeret. 

Szóval, mint az utolsót, azt akartuk, hogy elérhesse a háttérben, nem igaz? Szóval mit gondolsz lehet a első dolog, amit akarok itt? Ha mi fajta megy le ez a fajta paradigma itt? Azt érdemes elérhetjük óra, ugye? Szóval, van néhány var óra, amely equals-- mit gondolunk, hogy lesz? Dokumentum dot kap eleme by-- Én is Szeretem Sublime-- Id és mi Id óra. Pontosvessző. Van, hogy győződjön meg arról, hogy azokat pontosvesszővel ebben az időben, mert úgy érzem, hogy volt a probléma utoljára. OK, így, mint én csak azt mondom próbál hogy JavaScript frissíteni magát, itt van ez a nagyszerű funkció, I tudom, hogy jól jött tavaly, Nem vagyok benne biztos, hogy jól jön ez a PSET, de ezt hívják intervallumban. És ez tényleg nagyon Hűvös, ha a srácok semmit az idő, vagy kapok frissített információkat. Egy honlapon a végleges projekt, ez valószínűleg a kívánt funkciót hogy szuper ismeri. Szóval mit meghatározott időközökben nem az, hogy fogjuk, hogy ez egy funkciót, és milyen gyakran kell ezt a funkciót. OK? 

Tehát ebben az esetben, mi csak fog hozzon létre néhány névtelen funkció ismételt OK, hogy fog kapni a dátum és az időnket, majd frissíteni a dolgokat, és jelenítse meg. Tehát gondom. Mi lesz, mint generál órát itt. De mi van szükségünk, hogyan Gyakran annak a frissítése. Tehát ebben az esetben, ez csak milliszekundum. Szóval csak lesz do 100 milliszekundum. Természetesen, teljesen önkényes. Ha akarta, hogy frissíteni sokkal lassabban, amit lehetett. Mi lehet szórakozni A beállított intervallumban milyen nagy a mi intervallum után megkapjuk egy működő órát, ami remélhetőleg fogok eljutni. Tehát ez csak azt mondom, "OK, call Ez a funkció minden 100 milliszekundum. " OK? Ez minden, hogy nem. 

Tehát mi azt szeretnénk, ha a funkciót tennie, hogy azt akarjuk, hogy valamilyen időpontra és egy kis időt, amit fogunk van. Így tudjuk kezdeni a dátum megegyezik valamit, és mi az idő egyenlő valamit hogy még nem tudom. Vagy valóban, már csak be kell dátumot, mert dátum lesz is mindent. Ismét, ha csak a Google semmit mit akarsz csinálni, ha írsz, "OK, Azt akarom, hogy az idő JavaScript segítségével, "ez Önnek ezt a nagyszerű nevezett funkció get dátumot. Szó szerint, a legtöbb dolog hogy szeretne csinálni, JavaScript megy, hogy ez történt már. Szóval ez szó szerint, mint az új kap dátumot, ami creating-- vagy az új dátumot, rather-- amely a létrehozás Néhány objektumot, amely képviseli a dátumot. 

És mit fogunk csinálni itt ez-- fogom írni ezt, majd elmagyarázza, hogy mit csinál. Úgyhogy győződjön meg róla, kaptam ezt a jogot. 

OK, akkor mi ez a funkció csinál, mi csak megteremti a HTML, hogy valójában fog menni a mi div id az óra. Szóval mi ez fog csinálni csak generálva húr, OK? Ezt azután lesz átültetett a HTML. Alapvetően mit fog csinálni az amit we-- mit mutatok neked , hogy bármit is mondani HTML, fogjuk cserélni ezt a szöveget! , bármilyen HTML. Szóval ez lesz, hogy hogy megváltoztassuk a clock dot HTML attól, hogy csak a szöveg ennek kell egy órát, hogy valóban bemutató A számok és a dolgok, hogy mi érdekel szól, és valóban órakor. 

Szóval, mit fogunk csinálni a mi fog kezdeni generáló ezt a HTML. Így a hasonló módon, ahogyan használt csinálni, plusz egyenlő az egész, akkor most meg, hogy a húrok, kivéve, hogy fog összefűz. Ugye? Mint láttuk a párt dot js, ez csak összefűzi mindezt együtt. Szóval lehet összefűzni a különböző bit HTML a változók, vagy bit húrok hogy írjon ki magát, és ez csak Tényleg lehetővé teszi, hogy dinamikusan generál HTML, ami elég jó. Tehát, ha van valami, Nagyon felhasználó adott, Ez lehetővé teszi, hogy ezt tegyük. 

Tehát van HTML, hogy megyek próbálni, és biztos, hogy kap ez jobb. Így fogunk tenni néhány H1 fejléc. Szóval mi a fontos felismerni itt az, hogy ez valójában csak HTML. Ugye? Írunk tényleges HTML kódot itt, ez Nem csak egy csomó normál hogy mi alapján gondolnánk. Így van némi HTML. Ez tekinthető egy húr van mégis. És mi köze dátuma dot-- vagyunk szeretne kapni óra. Még egyszer, ha kellett figyelniük up semmit helyeket, ez azt mondani, ezek mind Az attribútumok ez az időpont. És itt van, amit lehet használni rajta. Tehát valószínűleg a dolgok, mint kap óra, és kap perc, és kap másodperc, és kap milliszekundum, és ki tudja, mi mást is. De ha megnézzük a dokumentációt, ez mind ott lesznek. 

Így már kap óra, majd akarnánk konkatenálására, hogy with-- vagyok fog mozogni ebben ide. Tehát ha már generáló most vagyunk ténylegesen generál az idő, ugye? Van órát, és akkor mi óra és perc közötti? Van egy pontosvessző, ugye? Ezért szeretnénk, hogy némi pontosvessző itt. És akkor mi szeretne kapni percében, így azonos módon hogy van dátumot dot kap óra, hogyan lehet most megkapjuk a perc? Ez szó szerint ez ideig dot kap perc, ami ezt nem szeretném. Ez olyan, mint, "Ó, milyen kapom perc? " Én csak megkapjam perc. 

OK. És akkor van még egy vastagbél itt. És akkor, ha azt akarjuk, hogy a másodperc, hogyan lehet most megkapjuk a második? Dátum dot kap másodperc. Azt hiszem, ez elég jó. És mi a fontos rájönnek, hogy mi is be kell zárnia a HTML tag van, mert akkor még mindig érvényes HTML, így H1. Cool. 

Így azután, hogy tehetünk óra dot belső HTML egyenlő HTML. OK? Úgy emlékszem, hogy azt mondtam, belső HTML alapvetően vesz bármit, ami között a két tag, hogy beszéltünk és betétek vagy manipulálja bármi is van ott? Szóval ez mire jó, ha megyünk vissza a nappal, az, hogy az óra utal mindent ez div. Ez a belső HTML Ennek Id óra div. És ez így fog változtatni, hogy A HTML, hogy mi csak létre, amely, ami remélhetőleg remélhetőleg, remélhetőleg, időt fogja mutatni most. Meglátjuk. Természetesen. Szóval sok technikai kérdések. Allison hogy-- vagyok off my játék ma a srácok. OK, hogy működik. clock dot belső HTML. Ez volt HTML Tényleg? Szintén ez az, ami történik. Ha nem látsz valamit, akkor csak nézd meg a forráskódot. OK. Akarsz tudni hűvös munka körül hogy fogunk csinálni itt? 

Közönség: Meg tudod csinálni betűt? A betűt? Mert van, hogy óra, majd kap perc. 

ALLISON Buchholtz-AU: Ez hogy kap óra és get-- ó. Ön are-- arany csillag. Ez az egész egy teszt, srácok. Ígérem, hogy dolgozik az osztály előtt. 

OK, de valami jó tudni, hogy lehet also--, ha néha A külső fájlok Kicsit őrült, akkor is csak őket egyenes itt, amely hajlamos rögzíteni a dolgokat. Kivéve, ez olyan, mint nagyon csúnya. Természetesen formázza mindent. Győződjön meg arról, hogy minden szép. OK. 

Azt akartam, hogy minden a hűvös demókat, és ők csak nem működik. OK. Script var óra. Egyébként, ami fontos, hogy ez az általános út hogy akkor formázza JavaScript. Mint láthatjuk, ez lehet Nagyon válogatós néha, akkor is, ha nem volt szó dolgozik két másodperccel ezelőtt. Vagy nem két nappal ezelőtt, de nagyon-nagyon közelmúltban. 

Tehát, hogy mutassa meg, mit kell kinéznie, és hogy mutassa meg, hogy én nem vagyok őrült, és hogy mindent pontosan ugyanaz, ez az, amit meg kell kinéznie. Te csak csinálni ezt a felső rész itt, és ha megtekinti az oldal forrását, ha azt veszi észre, ő néhány őrültebb dolgokat, én egyszerűsített azt. Emellett hitel Tommy McWilliam, akik ténylegesen segített létrehozni ezeket a példákat, ezért tudom, hogy működik. Mert Tommy egy JavaScript mester. De ha azt vesszük észre, van néhány sor. Megvan óra funkció itt. Ez mind a JavaScript, hogy Mi csak azt írta, vagy egy részét. Mi csak azt írta ez itt. És van egy extra funkciót, hogy csak párna is azáltal, hogy a nulla előtt levélben vagy azt megelőzően a számot, ha ez csak egy közülük. Tehát, ha azt veszi észre, ez elég sokkal pontosan mi csak írtam. Van néhány változó órát, hogy van mi elem, hogy elem azonosító, ami órát. Megvan a beállított időközönként funkciót, ami egy névtelen függvény amely végrehajtja ezt az egészet. Van néhány kezdő sora HTML hogy mi aztán dinamikusan generál azáltal, hogy néhány H1 fejléc, egybetoldjuk get az órák, valamint a vastagbél, plusz kapok A perc, plusz egy vastagbél, valamint a másodperc, és végül a záró HTML érte. És akkor mi frissítjük óra dot belső HTML HTML, és frissítjük minden 100 milliszekundum. OK? 

Lásd ígérem nem vagyok őrült. Nem tudom. Nem tudom, miért nem szeret engem. Úgy érzem, ugyanúgy néz ki, de úgy tűnik, utál. 

Tehát lássuk, ha kerek három jobban megy. Nemsokára látni. Nem vagyok biztos benne, hogyan fog ez menni. Mindenki legalább egyre a hátránya, mint a csak általános téma A JavaScript, igaz? Remélem, hogy ez legalább hasznos, több mint azt mutatja, hogy ez egy kicsit válogatós. De a probléma meg lesz nagyon szórakoztató. Ez jó lesz. Nem lesz annyira unalmas mivel ez, nem hiszem. Akkor valóban kap lásd nagyon klassz dolog. 

Így végül, de nem utolsósorban, megpróbáljuk a Twitter egyik. Én nagyon félek most, srácok. Nem tudom, hogyan fog ez menni. De csak, hogy ha egy kicsit több íz, és ez valójában manipulálni húrok és bemenetek, mit fogunk csinálni Azaz, ha azt vesszük észre, itt HTML-- ennek van egy kicsit more-- van néhány szöveget a területen, amely megfelel ennek a szövegnek a területen van. OK? És egy id a szöveget. Mi áttervezett, hogy egy kicsit néhány szélesség és magasság hogy már előre, és mi H1, amely csak a mi header egyik, hogy képviseli karakter maradt. Mi adta néhány Id a karakter maradt, és akkor mi van néhány script itt, ami én vagyok nagyon remélve, harmadik alkalommal a A varázsa van, srácok. 

Szóval mit akarunk csinálni, az azonos általános véna , amit csináltunk, óra dot js és fél dot js, mint azt vettem észre, A kezdtünk által ténylegesen rángatás A dolgok, hogy mi érdekli, ugye? Tehát ebben az esetben, van két dolgok, hogy mi érdekli, OK? Egy dolog, hogy mi vagyunk valójában milyen keresi és rajz adatokat, és az egyik dolog, hogy mi nem változik. Tehát ott a HTML. Ha ez az oldalunkra itt, mi Az adatok keresünk? Ez lesz bármi A szöveg a mi dobozok, ugye? Tehát amit én írja ide. Ez az, amit tudni akarok, vagy ez az, amit akarok nézni. És mi lesz változó honlapunkon? A karakter maradt. Tehát ugyanúgy, szeretnénk kezdeni inicializálása változók hogy valóban kapaszkodni azon elemeit. OK? Tehát ha van néhány var ez a mi szöveget területen, és van néhány var, hogy van még hátra. Ugye? Szóval ezek lesznek tartsa a két dolgot. Tehát ugyanaz a fajta dolog, dokumentum dot-- OK, én vagyok megy, hogy biztos, hogy ez fog működni ebben az időben. Én nagyon hajthatatlan. OK, így ha azt akarjuk, hogy szöveges terület szerint hogy a HTML, mi a azonosítóval? Mi a Id? Ez csak lesz a szöveg, mert ez teremt a szöveget területen, OK, és mi Id szöveget, úgy, hogy hogyan tudjuk megragadni, mi van benne. OK, pontosvessző. Én leszek super pontosan erről, mert azt akarom, hogy ezt a munkát ebben az időben. OK, nem ugyanaz a dolog, kap elemet Id. Én nagyon kíváncsi, mi van okozott a másik két összezavar. OK, akkor ebben az egy, mit akarunk elérni? Mi a Id itt? Van egy másik Id ben a HTML, mi ez? Közönség: karakter maradt. ALLISON Buchholtz-AU: Karakter maradt. 

OK. Cool. Szóval én csak fog írni ezt a nagyon gyors. Én csak megy, hogy megírjam ezt a második. Tehát szövegmezőbe. Milyen érdekes, B function-- van Sok funkciók, hogy nem csak megfelelnek az Ön egér, de a billentyűzet. OK? Szóval lehet mondani, a gombok préselt, amit tehetünk, ilyesmik. Tehát az egyik, hogy mi használ Felkérte továbbá gomb fel, amelyek azt mondja: "ha már megnyomta bármely gombját a billentyűzet, amikor a felhasználó felemelte ujjuk ki azt a gombot, és a kulcs vált préseletlen, Ezután fogunk tenni valamit. " OK? Szóval ez van értelme, ugye? Mivel minden karakter azt írja, megyünk hogy meg kell emelnie az ujjainkat off belőle, így amikor a kulcs megy fel, tudhatjuk, hogy csökkentse a karakter marad. 

Így van némi kulcsfontosságú fel, és azonos módon, fogunk mondani, "OK, ha ezt tesszük, akkor Készítünk néhány funkciója, hogy fog tartani e, "Ebben az esetben, és mit akarok, számítani száma hátra. OK, úgyhogy csak elkezd létrehozásával változó. Így van némi változó r, hogy fog képviselni hogy hány karakter van hátra. OK? Tudjuk, hogy kezdjük 140, és ha azt akarjuk tudni, mondjuk, a hossza a húr, hogy a már input, Srácok, van valami ötlete hogyan lehet csinálni? Csak alapján le a nyilvánvaló dolgokat, mint ha azt akartuk, óra, szoktunk kapni óra. Tudjuk, hogy a tárgy szöveget a területen, de Tudnátok gondol, mi lehet a után? Van ötleted? 

Szóval ez az ember egyfajta kevesebb intuitív, de ez értéke dot hossza. Szóval, csak adj egy kis value attribútum, hogy valójában a hossza a húr. Így fog mondani, "OK, én keresek Ebben a teljes string text területen, és fogok mondani Önnek mennyi idő van még. " Mert ha arra gondolunk, húrok tényleg csak tömbök, így tudjuk csak hogy a hossza őket. Tehát van, hogy. Cool. 

Akkor mit akarunk csinálni a mi Soha nem akarom, hogy a felhasználó a bemeneti több mint 140 karakter, ugye? Mert ha azt mondjuk, mint "Ó, te csak ennyi maradt, " majd hagyd, hogy nem, hogy Egyébként, mi már feküdt. És ez egy másik dolog, hogy a JavaScript lehet igazán jó A, a felhasználó hitelesítése és gondoskodjanak arról, hogy a használati beleillik az olyan szabályokat, hogy már bocsátottak. Tehát, ha szeretné, hogy a dolgokat, mint hogy arról, hogy valaki input e-mail címét, vagy, hogy mikor be két jelszó, akkor kiegyenlített. JavaScript képes erre. Te valami ilyesmit kellene, "ha Az űrlap elküldése ", vagy hasonló, "Amikor Űrlapküldés gomb kattintott, ellenőrizze ezeket a dolgokat. " És nem tehetünk, hogy a JavaScript. Szóval ez az, amit fogunk itt csinálni. 

Szóval mi lehet a módja annak, hogy ellenőrizze, Mentek mint 140 karakter? Mi fog történni mi értéke r, ha megpróbálnak? Ez lesz a negatív, ugye? Vagy ez lesz kevesebb mint vagy egyenlő nullával. Így tudjuk használni az, ha ez Csakúgy, mint bármi mást. OK? És van néhány szöveges terület dot értéket, és mit csinálunk itt a mi csak cutting-- mi ez? Bocsánat. Ez az egy, amit csak akar visszatérni hamis. I összezavarodott. Minden frazzled a dolgok nem működnek. OK, mi csak szeretnénk return false, és akkor szeretnénk megjeleníteni fennmaradó karakterek, ugye? Tehát az óra, megcsináltuk valami belső HTML, ugye? Itt állítottuk, hogy azonos bizonyos változó, így mi is csinálunk itt? Mit keresünk változó belső HTML az? 

Közönség: Hátralévő? 

ALLISON Buchholtz-AU: Megváltoznak megmaradt. Rendben, és mit Célszerű úgy beállítani, egyenlő? Ez lesz r, mert ez kell legyen a karakter marad. OK? Szóval tényleg ideges vagyok, hogy ha ez működik most, de majd meglátjuk. Hagyja ezt. Ez nagyon gyors. [Hallhatatlan] OK. Ismét Én csak megy, hogy mutassa meg. Bármilyen okból, enyém dönt, hogy nem működik, de amit én megmutatom neked, hogy ez a ez-- oh kellett volna tenni, hogy az. OK, azt vesszük észre, ugyanaz a fajta dolog itt, egyre szöveges mezőbe. 

Továbbá, ha a srác értesítést, ha van valaha valamit akarsz csinálni, és nem tudod, hogyan kell csinálni el, csak kattintson Oldal forrása, és ők fognak mondani. Néha ez lesz titkosítva. Az Ön PSET, mi titkosítani mindent, így csak úgy néz ki, mint halandzsa. De ha valaha egy igazán Hűvös honlapján, hogy tetszik, Ha csak kattints Oldal forrása, ez fog mondani, hogyan kell csinálni. Tehát újra, a munka okosabb, sem nehezebb. És ahogy itt lát, az összes ezek a dolgok a ugyanaz. ez itt csak némi töredékszó hogy emlékszem pontosan, hogy ez mit jelent. De ez nyilván némi töredékszó Az érték a nullától tízig, és hamis értékkel tér vissza, amit le kell állítani A felhasználói írják be többé, és akkor nyilván frissíti a belső HTML ott. 

Cool. Olyan nagy take aways mától, kísérlet, nézd meg a forráskódot mert ez fog segíteni sokat, és mindenki, néha JavaScript Lehet, hogy nehéz vele dolgozni, és nem Mindig úgy működik, ahogy elvárná, de csak próbálkozom mert ígérem, hogy lesz. Ígérem összes példában dolgoztak osztály előtt. Nem értem, mi történt. Szó szerint mindent ugyanaz. 

Még egy dolog, hogy én csak azt szeretném mutatni nektek, hogy lehet szuper hasznos A in-- mi működik már? Kaptunk fél munkát, ugye? Azt hiszem, igen. Igen. Megcsináltuk. Félelmetes. OK, így egy dolog, hogy srácok tudni kell a konzol log, hogy én beszéltem. Tehát vigasztalni dot log Hello. Tehát ez a fajta a JavaScript megfelelője printf. Tehát, ha valaha is szeretne ellenőrizze a változók vagy mi is történik ott, mit amit tehetünk, ha Elem vizsgálata, az, amit akarsz menni a, és akkor konzolra, látni fogod, hogy a nyomtatott helló. 

Így lehet, hogy azt print amit akartunk. Ha akartuk, hogy nyomtatni háttér dot stílusban dot háttér, képesnek kell lennünk, hogy a RGB hármas, hogy jön fel. Vagy nem. Emlékszem pontosan, hogyan nyomtatni egy változó ilyesmi, de meg kell tenni, hogy nyomtassa ki az ilyen dolgokat. Hogy nagyon hasznos lesz a PSET ha akarsz manipulálni koordinálja és miegymás. Így ők is változtatni ez a darab az osztályban. Ez különbözik a elmúlt évben, így Csak a szép, hogy a TF, illetve a TF- a hivatali órák helyett, mert mi vagyunk fajta tanulás mellett srácok. De a konzol log szuper volt, szuper hasznos JavaScript tavaly. Szóval nagyon tetszik. Ismerje meg, hogyan kell használni. Ez könnyebb használni, mint GDB, hogy legyen legalább egy plusz pont. De köszönöm srácok viselő velem. Sajnálom, hogy én példák valamilyen okból Csak nem akartam, hogy együttműködni velem, de én remélem, hogy ez segített a fajta kapsz egy kicsit több az övezetben a JavaScript. És küldjön nekem minden kérdésre az jövő héten így is szuper javítani, és hozok édességet és még extra candy, mert ez nevetséges volt. De a srácok nagyszerű, és van egy félelmetes héten.