ALLISON Buchholtz-AU: Olgu kõigile.
Tere tulemast tagasi sektsioonis.
See on meie eelviimane lõik.
See on nii kurb.
Ma ei tea, mida ma lähen tegema nägemata kutid igal esmaspäeval.
Ma arvan, et me peaksime lihtsalt-- Võib-olla võiks ainult
siin kokku ja on õhtusöök või midagi.
Ma ei tea.
Ma toon toidu asemel.
Me lihtsalt rääkida.
Aga jah, järgmisel nädalal olla meie viimane lõik.
>> Selle teadmiseks, pead viktoriin järgmisel nädalal.
Ma tean, et ma unustasin, et teen, nagu, Kahe nädala etteteatamise eelmisel nädalal
kuid loodetavasti kutid teadsin, et see oli tulemas.
Loodetavasti see on üks viimaseid midterms kutid jaoks semester.
Aga see läheb hõlmama kõiki materjali, et oleme läinud üle.
Nii see ei meeldi võid lihtsalt unustada umbes neljast silmusest või muutujad.
Kuna me õppisime need alguses,
need on ilmselt õiglane mäng oma viktoriini.
>> See saab olema samas formaadis, samal pikkus, et sa juba sellega harjunud.
Seal saab olema kodeerimine käsitsi probleeme,
võibolla mõned true false, võibolla mõned lühike vastus.
Nii et sa peaksid olema tuttav formaadis
eriti kui te võtate praktikas katseid.
Aga nagu ma ütlesin siin, see on kumulatiivne, kuid me kindlasti
hakatakse keskendudes asju nädalas kuue aastast.
Niisiis, me ilmselt ei kavatse teilt küsida, kui palju baite
on iga tüübi või seda sorti asju,
kuid me ilmselt saab olema huvitatud asjad ahelloendid,
või erinevad andmestruktuurid või erinevate algoritmide
et me oleme rääkinud.
Seega veenduge, et sa oled tõesti üles neid, ja kui te
vaja ressursse, siin on palju ressursse.
Ma just andsin sulle lahke on kiire loetelu seal.
>> Järgmisel nädalal toimub viktoriin vaadata selle aja jooksul.
Nii et kui teil on mingeid küsimusi või konkreetsete teemade,
konkreetsed asjad viktoriin, soovite minna üle, siis
Kirjuta need mulle enne tähtaega, et ma saaks omamoodi valmistada mõned materjali eest.
Ja lisaks sellele jaos läbivaatamine, siis me
Samuti hoiab käigus kogu vaatama nagu eelmisel korral.
Ja see saab olema teha samu inimesi.
Ma ei tea, kas see muudab paremaks või halvemaks,
kuid see saab olema minu Hannah, Davan ja Gabe uuesti.
Nii et kui sa tahad tule vaata meid kõiki tögamine omavahel
ja sõelub viktoriin ülevaade, mida sa peaksid kindlasti
tulla, et järgmisel esmaspäeval ka.
Nii et sa pead lihtsalt esmaspäev jam pakitud of viktoriin vaadata, mis on hea
sest siis on teisipäev töödelda läbi kõik.
>> Aga kindlasti ei vaadata neid ressursse.
Study.csv.net on kaugelt, I arvavad, üks kasulik
enamasti, sest see on palju proovi kood,
see on kõik Power Points kõik märkmed seda,
mis on tõesti see, mida ma teha kõige minu jagu materjale.
Kui seal on midagi eelmisel sektsioonid, et ma võib-olla välja saadetud
et te ei pruugi olla saanud, lihtsalt andke mulle teada.
Nagu eelmisel nädalal proovi kood, kui keegi ei saa seda,
lihtsalt kirjuta mulle või tule minuga rääkida, ja ma veenduda, et sa saad seda.
>> Nii et täna me ei kavatse olla räägime JavaScript.
Nii et siin me Tommy, kes ma olin lihtsalt räägin sinuga eile õhtul.
Ma armastan Tommy.
JavaScript on tema lemmik keeles, nagu ta ütleb siin.
Nad proovida ja öelda, et see on ei ole parim, ja nad on valesti.
Nii Tommy on JavaScript master.
Ma pole päris tema tasandil, kuid ma olin nagu,
"Tommy, kuidas ma õpetan need lapsed JavaScript? "
Nii et ma sain mõned nõuanded, et loodetavasti nad töötavad välja.
>> Nii paar asja on teada, et JavaScript on skriptimist
keeles, nii et PHP on midagi et pidasime rohkem server-side,
see oli üles laadida serverisse, koostatud ja vormistatud seal.
See üks on täidetud oma arvutisse.
OK?
Nii laete mõned JavaScript lehel ja ta täidab oma masinale.
Süntaks on väga sarnane C ja PHP.
Me läheme läbi mõned näited JavaScript,
ja sa lähed, et näha, et kuidas me räägime muutujate, silmad,
ja tingimused on kõigil väga sarnased.
OK?
Asjaolu, et nad on nii sarnased on ilmselt läheb reis mõned teist
up, mõnel juhul ainult sellepärast saate lisada natuke C
kus ei tohiks.
Äkki proovida ja kirjuta midagi kui see ei peaks olema trükitud.
>> Ja et üks asi on teada, et JavaScript
on dünaamiliselt trükitud keeles, nagu PHP.
Nii et kui te poisid mäletan p-st eelmisel nädalal
kui me olime mingi teed Meie PHP kiirkursuse,
Me nägime, kuidas string võiks olla kujunes int üks, ja nii edasi.
Tüüp oma muutujad määratakse töötamise ajal,
et nad võivad ajas Programmi käigus,
ja samamoodi, et me ei tõesti tunnistada tüübid PHP muutujad,
me ei kavatse olla teeme sama asi siin, kus me ei tunne
kontrollides tüüpi meie muutujate nii-öelda nagu me teeme C.
>> Ja siis üks asi see on päris lahe on
et saate viga vaadake kaudu konsool
selle suure funktsiooni console.log, mis
saate printida erinevatele muutujate või esemeid, mida jagame
rääkida.
Täpselt nagu eelmisel nädalal, kui olin nagu "kasutada seda funktsiooni," prahiga
oma pset see funktsioon mida soovite kasutada, console.log.
Ma olin nii üllatunud, kui palju õpilased tööaega
ei teadnud dump funktsiooni.
Ja ma olin nagu: "poisid, see tahe teha oma elu palju lihtsamaks. "
>> Olgu, nii et oli selline lihtsalt lühike asi, nagu alati,
meil näiteid.
Ma tean, et te poisid armastavad neid.
Nii et siin on näide väga Lihtne JavaScript fail siit.
Nii et see on lihtsalt kavatse luua see pop-up, mis ütleb,
"Hello world", kui sisestage lehe, kuid olgem
proovida ja kõndida läbi selle natuke.
Nii et ilmselt see on lihtsalt nagu teie tavaline index.html.
Niisiis, just meie tavaline mall siin ja meil on HTML, meil on head,
ja nagu CSS, kuidas me lisada mõned väljaspool faili, eks?
Meil on mõned script type teksti, mis on JavaScript.
Ja allikas on hello.js, mis on siin.
See on kogu fail hello.js.
Ja siis on meil mõned pealkiri ja mõned keha HTML
et me tõesti ei hooli.
>> Mis juhtub on see, kui me seda lehte laadida, see automaatselt käivitab skripti.
OK?
Nii JavaScript hakkab teostada automaatselt.
Nii et mida see tegema hakkab, siis läheb otsekohe liikuda ja täita see.
Ja see läheb öelda, "teate.
Hello world. "
Milline alert on funktsioon, mis tegelikult tekitab see kast.
OK?
Nii et see on omamoodi kõik, haarates.
Pole midagi ekstra pidime teha peale lihtsalt hoiatus,
ja siis ükskõik, mida me tahtsime meie Alert kasti.
OK?
Nii see on lihtsalt super lihtne näide sellest, mis JavaScript teha.
>> Üks väga lahe asjad, mida me näeme,
on see, et JavaScript saate manipuleerida oma veebilehekülgedele,
ilma et laadige neid iga kord.
Nii et kui sa want-- näiteks kui sa varjutavad midagi,
kui te poisid kunagi näinud nagu Menu baarid,
või kui sa hõljuma üle mõned teema, rippmenüüst menüü,
see on sellepärast JavaScript.
OK?
Nii et te ei pealelaadimisel kogu lk saada see menüü, et näidata üles,
sa oled lihtsalt otsin mõned konkreetsed meetmeid, et kasutaja on teinud
mida nimetatakse sündmusi, mis me jõuame arvesse, ja kui sa näed, et sa ütled,
"OK, muuta midagi selle lehele ja teha see välja erinevad,
vaid ainult muuta neid konkreetseid asju.
Ärge laadige kogu asi. "
Nii see tegelikult on palju ilusam ja sa ei pea uuesti laadida saidile,
ja see on väga lahe.
>> Nii muutuja deklaratsioonid, nii saab sellist näha,
Panin peal siin, lõdvalt kirjutatud.
Nii et see on väga sarnane PHP.
Meil ei ole vaja öelda JavaScript millist tüüpi me oleme
oodanud kõik need muutujad olema.
Nad võivad olla mis iganes tüüpi tahame.
Nii märkate sel juhul me kuulutame neid väga lihtsalt, vaid on "var"
ja siis iganes me tahame Meie muutuja nimi olema.
Üks asi on tähele panna, et kui sa pane var ees muutuja nimi,
see kohapeal kehtivuspiirid ta.
OK?
See on täiesti mõistlik teile täiesti lihtsalt kustutada var
ja lihtsalt s võrdub CS50 ja et oleks lihtsalt globaalse muutuja.
OK?
Nii saab initsialiseerida see mõlemas suunas, lihtsalt sõltub sellest, kuidas sa tahad seda.
Seega, kui olete initializing jooksul funktsioon,
ja sa tahad, et muutuja jääda scoped jooksul selle funktsiooni
sa lähed tahan teha midagi var nimi muutuja,
versus kui sa tahad seda globaalselt scoped, siis
võid teha nimi muutuva ja seejärel
iganes soovid seadis võrdne.
OK?
>> See on selline lahe asi siin, sest kui me märkame meie muutuja
b hakkab läbi tõsi.
Ja mida see does-- saa keegi mulle öelda, mida see teeb?
Nii et meil on mõned teate.
Mida tüüp b olla alguses?
Sihtrühm: Boolean.
ALLISON Buchholtz-AU: Boolean.
Õigus.
Ja siis me ümber jaotada b Selle string, eks?
Nii siis siin, millist tüüpi b olla?
Oleks string, eks?
Mis on oluline teade on, et c oleme
võiks peaaegu kunagi teha midagi sellist.
Me tahaks olla on varieeruv, enamus seda millegi muuga,
võibolla teha mõned funktsiooni kaks i, minna tasuta täisarv.
Aga kui me märkame siin b väga lihtsalt muudab tüüpi.
>> Sihtrühm: Oota, nii et saate lihtsalt olema nagu "teha b täisarv?"
>> ALLISON Buchholtz-AU: Jah.
Sa võid ümber jaotada b täisarv.
>> Sihtrühm: Kas tõesti?
>> ALLISON Buchholtz-AU: Jah.
Ja siis oleks int.
Nii et teie muutujad võivad ajas Programmi käigus ka.
Need ei ole tingimata kirjutada.
On väga lõdvalt kirjutatud.
OK?
Põhimõtteliselt oma muutujad saab teha mida iganes nad tahavad, sest me sellist nägin PHP.
Seda on võimalik teha mõned hull asju, nii see on oluline olla päris ettevaatlik.
Pane oma muutujate hästi.
Kui te seda ei tee, äkki sa lähed olema nagu,
"Oota, ma arvasin, et see oli string, ja nüüd on int,
ja ma ei ole päris kindel, mis siin toimub. "
Nii et see on lihtsalt näide näidates, kuidas muutuja saab kergesti
muuta selle tüübi üle käigus programmi.
>> OK.
Nii et see peaks välja nägema super, super tuttav.
Nii et need on meie silmuseid JavaScript.
Nad on täpselt samad, välja arvatud nelja asemel int i võrdub nulliga,
me võiks lihtsalt öelda var i võrdub nulliga.
Ja siis me võiks olla meie samasugust tingimust, samasugust värskenduse
i pluss pluss töötab just fine.
Nii püksid on samad, whiles on samad,
ja teha whiles on täpselt sama.
Sama mõttes üldise formaadis.
Märkame, neli, sulgudes sulgudes, see on kõik sama.
Ka seal on semikoolonid kui saame näiteks koodi.
Näete see on päris sama palju c.
>> Sest funktsiooni deklaratsioonid, jälle väga sarnased.
Meil on mõned funktsioonid, mida lihtsalt ütleb, et see on funktsioon ja seejärel
nimi meie funktsioon ja sisendeid.
Ja veel, kui märkame me ei tüübid siin üldse.
Õigus?
Meil ei ole midagi öelda, et need tuleb ints või kahekordistab või ujub.
Nad võivad olla mida iganes nad tahavad.
Oluline on märgata, et meil on vaja kirjutada funktsiooni eelnevalt
lasta JavaScript teada, et see on tegelikult funktsioon.
>> Nii et see on vaid mõned lihtne summa funktsiooni, mis tagastab x või y,
ja siis mis on ka cool on see, et saate tegelikult
määrata funktsiooni muutuja.
Nii sel juhul summa on nüüd funktsioon, mis tegelikult teeb summa.
Nii et kui te märkate siin on meil Funktsiooni nimi Funktsiooni sisendeid.
Õigus?
Siin on olemas vaid funktsiooni ja sisendeid.
Nii et see on nn anonüümne funktsioon.
Ja see on midagi, mis peaks olema uus enamik kutid, kui mitte kõik teile.
Ühesõnaga, mida see tähendab, et meil ei ole
pead nimi meie funktsiooni antud juhul.
Me saame vaid öelda: "OK, ma lähen on see funktsiooni täidab siin
on selle sisendite ja siin mida see tegema hakkab. "
Ja eriti kui sa oled määrates funktsiooni teatud muutuja
et sa lähed manipuleerida, Sa ei pea
vaja nimetada, sest sa lähed tuleb viidates
talle käesoleva muutuja nimi, mitte mis tahes
funktsiooni tegeliku nimega.
OK?
>> Nii et kui me näeme siin, me mõnesid muutuva summaga nüüd
mis on võrdne summa kolm ja viis.
Ja me oleks saanud seda.
Ja see on ainult mõned tähelepanelik, kolm pluss viis on võrdne arv.
See pluss lihtsalt concatenate mis tahes meie vastus oli peale string.
Samuti cool, pluss saab concatenate stringe.
>> Sest JavaScript, nagu PHP, HTML ja CSS nagu me ütlesime,
Palju see Oleme omamoodi võttes Apupyörät off siin
ja kutid on palju know kuidas tegelikult mõista neid asju.
Nad on veidi teistsugune, kuid nad ei ole nii võõras
ja et sa ei saa googeldada asju või vaadata neid online w3 koolides.
Ja me tõesti oodanud sind poisid, selline, eksperiment
ja õppida ise.
Niisiis, ma tean, et see võib tunduda natuke vähem põhjalik kui mõned c asju
me teeme, kuid see on tegelikult põhjusega.
Aga loodetavasti see ei ole liiga erinev, ja see ei ole suur.
>> Nii massiivid JavaScript, jälle väga sarnased.
Õigus?
Meil on mõned muutuja massiivi see on võrdne tühjad sulud,
ja see on ainult tühi massiiv.
See on sageli nimetatakse grammatiline massiivi märke.
See on lihtsalt üks asi, mida me nimetame seda.
Kui me näeme hulgaliselt kaks siin, meil on mõned grammatiline massiivi kuulub kolm elementi,
õige?
Ja siis on meil mõned var kolmas element, mis on
mõned muutuja, mis on lihtsalt läheb hoidke seda stringi, JS.
>> Elemendid, hea märgata, komadega eraldatult,
nagu me ootaks.
Ja saab avada ka need, nagu tegime C, kus see indeks märke, eks?
Nii erineb PHP Nüüd, me ei kavatse tagasi
lihtsalt selline viidates asju, mida indeks.
Just nagu C, see on ka nulli indeks.
Ma tunnen, et see oleks väga julm kui nad äkki tegi JavaScript üks
indeks, ja siis tuli täiesti mõtlema, kuidas sa arvad massiivid.
>> Üks lahe asi on see, et selle asemel, et neil tuleb do-- kui sa kunagi
tahtsin pikkus array, äkki sa itereerima läbi
kuni leiad mõne lõppu või sa oleks lihtsalt teada, mis see on.
Kuna JavaScript on väga lahtine rohkem võimalusi kui lihtsalt tüüp, nagu me näeme siin,
saame lihtsalt see massiiv suurem, sest me otsustame.
Kui märkame massiiv kolme on kolm asja alustada,
kuid siis äkki, me oleme nagu "oh, lihtsalt nalja.
Me tegelikult toimub et muuta see 101 asju. "
Nii et kui sa kunagi tahad teada tegelik pikkus oma massiiv,
sa seda niimoodi.
Ja me näeme palju Selle märke näiteid,
kuid JavaScript see on tavaliselt iganes
objekt, mis sa räägid dot olenemata sellest, millist funktsiooni
mida soovite rakendada seda.
OK?
>> Nii sel juhul meie Eesmärgiks on massiiv kaks,
ja me ütleme, et me tahame pikkus array kaks.
Nii see lihtsalt nõuab, nagu pikkus selle kohta.
Ja et naaseb oma pikkus.
Ka midagi tähele et kui märkame meie massiivid
Erinevalt C, ei ole neil olema kõik sama tüüpi.
See on palju nagu PHP.
JavaScript on põhimõtteliselt nagu see huvitav Meld C ja PHP.
Nii et me võtame arvesse, et.
Sest nüüd, lähme lihtsalt eeldada et teie massiivid on põhimõtteliselt
nagu C massiivid, et nad on null indekseeritud.
OK, nii et on kõike.
Võite ka lihtsalt laiendada massiivi iganes indeks soovite.
Käesolev ilmselt SEG süü teie või anda teile mõned viga
JavaScript on nagu "nah, see on hea.
Ma sain selle.
Me lihtsalt minna otse kui sa tahad. "
>> OK, nii et objektid on väga oluline.
Kutid kasutad palju neid Teie P komplekt, kui ma õigesti mäletan.
Nii asi, et need on sarnane C on struktuurideks.
Nii et sa ei mõtle about-- kui läheme näiteks õigus
Pärast seda ma arvan, et see tulen teha palju rohkem sense--
kuid me põhimõtteliselt kasutada objektid korraldada muidugi seotud teavet.
Kui me rääkisime struktuurideks C, mida me sageli
rääkida üliõpilane, kes oli mõne nime, ID, maja, sa tead, kontsentratsioon.
Ja see on omamoodi sama asi et me kasutame objekte siin.
See on lihtsalt korraldada sarnast teavet.
>> Võite mõelda ka neid rohkem sarnased ühistutega massiivid PHP.
Nii et see oleks selline asi kus meil on mõned olulised mõned väärtus,
väga sarnane PHP.
Nii saab initsialiseerida mõned tühja objekti, nagu me näeme siin,
lihtsalt lokkis traksid.
Nii massiivid on nurksulgudes.
Tühi objektid on looksulg.
Hea vahet on.
Ja need on vaid kaks erinevat viise määrata omadused.
Nii et see on omamoodi palju rohkem nii, et
sarnaneb PHP, meie assotsiatiivne massiivid, meie peamiste,
ja meie raha, samas see on-- saate
vaata seda palju rohkem JavaScript.
See kipub olema konventsioon.
Ja samamoodi, et tegime massiivi kaks dot pikkus, see ütleb,
"OK, anna mulle seda atribuut Selle objekti. "
Õigus?
Nii samamoodi see oli nagu, "anna mulle atribuut pikkus array kaks, "
see ütleb, "anna mulle vara meie tühja objekti. "
Või antud juhul oleme määrates selle mingi väärtus siin.
Aga sa võiksid juurde ka seda.
>> Ja siis siin see on lihtsalt millel on kaks erinevat teateid.
Nii et see näitaks teateid oleks täpselt sama,
see on lihtsalt kaks erinevat viisi tutvumise element, mida me tahame.
Kas on mõtet kõigile?
Ma tunnen, et see üks ilmselt mõttekam,
lihtsalt sellepärast, et me tuleme välja PHP.
Aga kui me teeme rohkem näiteid, seda on sõna otseses mõttes täpselt sama.
Palju on lihtsalt muutuda süntaks.
>> OK, nii et näiteid.
Ma armastan näiteid.
Nii et siin on mõned CS50 muutuja, mis on objekti,
ja me salvestada see kõik teave selle kohta.
Nii et meil on muidugi õpetaja, tfs, psets ja teibitud.
Nii märkame neid on peaaegu kõik erinevad.
Õigus?
Nii objekte saab salvestada atribuudid erinevad.
Me ei mõtle see-- see on väga sarnane meie assotsiatiivne massiiv PHP.
Nii võtme väärtus, võti, väärtus, võti, väärtus nii edasi ja nii edasi.
Mis on huvitav samamoodi et meil on massiivid jooksul massiivid
saame ka objektide objektide või massiivid jooksul objektid.
Sa ei ole kunagi tegelikult piiratud lihtsalt üksik asju.
Saame väga Inceptionesque, vaid Jätkab Down the Rabbit Hole seal.
>> Nii et kui me märkame me mõned muidugi, et
on string, juhendaja, et on string, ja massiivi int ja Boole'i.
Nii et kõik need erinevad asjad.
>> Hea küll, jah, meil on veel üks.
Nii et kui meil massiivi objekte.
Nii lihtsalt meeldib objekti võib olla massiivi ta.
Me saame ka hulga esemeid.
See võib olla kasulik mõtle sarnane liiki
kuidas meil oli hash Tabelis oli meil hulgaliselt
Kõigi nende tüüpi struktuurideks, et
olid viiteid erinevatele sõlmed ja tühi-tähi.
Kuid sel juhul me on hulgaliselt esemeid.
Nii et see on nagu massiivi ühistute massiivid.
Nii et meil on mõned esimese osa oleks olla objekti nime James
ja maja Winthrop.
>> Kutid võiks meeles pidada midagi väga sarnane käesoleva
oma viimase pset, kus, kui te tõmmatakse midagi oma andmebaasi,
Esimene omamoodi asi oma rida oli
kõik informatsioon esimene kasutaja, et täidetud on,
ja siis tuli indeks, mis saada oma aktsia või nende cache
või tühi-tähi.
Nii et see on üsna sarnased asi, väike vaheldus
süntaksis, natuke muutus sõnad, mida me kasutame nende kirjeldamiseks.
>> Nii et kui me tahame, saab keegi öelda mulle, mida see märguanne teeks siin?
Või mis see natuke kood teeks meie jaoks?
Sihtrühm: See annab sulle kõik nimed.
ALLISON Buchholtz-AU: Õigus, nii et see oleks lihtsalt hoiatada kõiki nimed
sest see läheks läbi suvila i, nii et ta tahaks alustada nullist.
Seega ütleksin, OK ootame See esimene objekt, mis
on esimene pesa meie massiivi.
Ja ta ütleb, "anna mulle atribuudi nimi, et objekti. "
Nii me läheme siit Soovime scan, me tahaks leida nimi,
ja me tahaks välja printida James, Molly ja Carl.
Kõik küsimused nii palju?
JavaScript kahjuks sa lähed olema
teeme palju otsin üles oma enda figuring süntaks,
vaeva sellega.
Aga muidugi ma olen alati siin, Tööajal on alati siin.
Ma võin olla teisipäeviti sel nädalal.
Nii et kui sa oled seal, saate tule mulle külla sel nädalal.
See oleks tore.
>> OK, nii DOM on dokument-Object Model.
Nii et see on lihtsalt viis et meile meeldib mõelda
kuidas meie HTML ja kõike jooksul on korraldatud.
See on väga palju midagi, Tõenäoliselt tulla oma viktoriini.
Ma tean, et minu aastal oli see nagu siin on HTML fail, täitke DOM ta.
Ja sa lihtsalt täita vähe asju.
Need peaks olema lihtne punktid loodetavasti.
Loodetavasti saate see--
>> Sihtrühm: [kuuldamatu]
>> ALLISON Buchholtz-AU: Nii sa näed seda puud siin?
>> Sihtrühm: Jah.
>> ALLISON Buchholtz-AU: Nii nad küsivad kasutamine
täita mis läheb kere all.
Võib-olla kere all, meil on mõned divs või meil on mõned punktid,
ja me palume teil täita puu väga meeldib see.
Nii me jalgsi läbi.
Nii Document Object Mudel on lihtsalt viis
struktureerida ja mõelda meie HTML graafiliselt.
Ja ka siis, kui me saame jagada rohkem JavaScript,
see saab olema nii, et me tegelikult
manipuleerida erinevate elemendid lehel.
Meil on vaja viivat iga asjad meie HTML,
ja nii see annab meile väga betooni standardiseeritud viis
mitmes veebilehti teha.
>> Nii et kui me lihtsalt kõndida läbi see siin muidugi
meie dokument on nagu meie kogu toimikule.
See ilmselt mõttekas et see kõrgeim asi,
ja siis oleme meie tegelik HTML, mis vastab see silt siin.
Ka siis, kui taandes oma silte korralikult, siis luua see DOM puu
muutub super lihtne.
Nii et meil on mõned head siin.
Meil on mõned keha, mis näeme varre maha HTML,
mistõttu on meil pea ja keha.
Jooksul pea, meil on mõned pealkiri tag, end pealkiri tag,
nii et me teame, mis tuleb pärast pea.
Ja meie pealkiri tag, meil hello, world.
OK?
Nii et kogu see vasakul filiaal.
Ja siis paremale käele filiaal Siit näeme, et meil on HTML,
OK oleme teinud seda peaosa, me otsime just keha,
nii et meil on mõned keha piirkonnas.
Ja selles, vaid asi, mis meil on hello, world.
OK?
Kui meil oleks asjad mõned sulg p ja seejärel
hello, world, ja siis teine sulg p hüvasti maailma
oleks meil kaks mulli maha tulemata siin.
Sest nad on nii keha alla, kuid nad eraldi punktid käesolevas asjas.
Kahtlemata on praktikas kohta, et eelmisel viktoriinid
samuti palju Internetis ta.
OK, nii see lihtsalt võimaldab meil näha kõike kenasti
ja manipuleerida asju väga süstemaatiliselt.
OK?
Me teame täpselt, kuidas läbida läbi selle puu,
nii et me teame, mida me tahame pääseda.
>> OK, nii et see on põhjus, miks me tahame on selline mudel,
nii et saame kasutada selliseid asju, ja saame aru, mida need tähendavad,
ja nad on standardiseeritud üle kõik asjad, mida me teeme.
Nii dokumendi dot pealkiri on lihtsalt pealkiri our-- kõik need
on üsna mõistetav, Mulle meeldib mõelda.
Nii esimese kolme näited on lihtsalt öeldes
"OK, anna mulle Pealkiri see veebileht. "
Nii et see annab sulle, mida vastab pealkiri.
>> Dokumendi dot keha on annan teile kõik, mis nende keha sildid.
Nii saab manipuleerida, et.
Ja dokumendi dot keha dot sisestage HTML on väga lahe üks,
ja võib-olla ei ole, nagu Super intuitiivne, kuid sisemine HTML
vastab see siin.
Nii et kui sa kunagi tahad manipuleerida teksti lehel
tavaliselt sa lähed tegema midagi keha dot sisemine HTML.
OK?
Nii sisemine HTML kipub viidata mis on tegelikult nende vahel sildid.
OK?
Ja siis kasulikke funktsioone.
Nii et kui sa tahad saada mõni neist, mis tahes element,
meil on mõned Id, klass nimi või silt nimega.
See on väga sarnane asju tegime CSS, eks?
Kui meil on mõned valijad, et vastavad kas tag, klass
et me anname neile või Id.
See on väga palju samamoodi.
Kui teil on midagi, mis on mõned klassi koer,
ja sa ütled saada elementide sildi nimi ja paned koera there-- või kahju,
klassi nimi.
Võid panna dot seal.
See läheb tagasi kõik need elemente, et on selle klassi.
Nii saab manipuleerida ainult neid.
Samamoodi, äkki sa lihtsalt tahad manipuleerida mõned header, seega
mõned h1 header, nagu me tegime.
Sa võid seda teha saan elemendid tag Nime, sest h1 on silt nimega.
Ja samamoodi, kui sa tahad saada mõned unikaalsed asi, mida saate teha get tag.
Saa osa by Id.
Ja nad on tegelikult palju neid.
Need on vaid nagu kolm väga palju.
Nii et kui te lähete online, kui Ma lähen, et julgustada
sa teeksid, ja teha mõned teadus ise,
Ma kindlasti soovitada uurida kõiki neid.
Nad võivad olla super kasulik, eriti kui
soovite lihtsalt selline manipuleerida väga konkreetseid asju ilma
läbida ja proovige sordiks välja kõike.
>> OK, nii et viimane asi, on JavaScript sündmusi.
Nii et kui ma rääkisin varem umbes läheb peale veebileht,
ja kui te hover üle midagi, või teie hiirekursor midagi,
midagi juhtub.
See on see, mida me tahaksime mõtle kui sündmus.
Mis meil, mis võivad kasulik on siin onclick.
Nii kaevanduse oli hover, mis ma olen päris kindel, on lihtsalt hover.
Samuti ton neist et saate otsida.
Seal on terve nimekiri Internetis Erinevate asju
et saate kuulata.
>> Aga JavaScript sündmused põhimõtteliselt lihtsalt vastates asju
et teie kasutaja teeb.
Õigus?
Nii et teie kasutaja ei midagi, see on sündmus,
ja JavaScript vastame aga soovite seda.
See vastavalt reageerima.
Nii et kui meil mõned aknas dot onload.
Nii et mida see ütleb on, "oodake kuni akna laetud. "
OK?
Nii et kui kõik on koormatud onload, siis on võimalik täita seda funktsiooni.
Nii et kui kõik on koormatud, sa lähed
on mõned nuppu Otsi mis saab osaks ID,
ja see prindib iganes see element on nuppu Otsi.
Ja siis on meil see muutuja, me ütleme: "OK, onclick."
Nii et kui me kuuleme click aasta nuppu Otsi,
täidab seda ülesannet, mis on tähelepanelik, klõpsasite nuppu Otsi.
>> Mis juhtub on-- see on kena väike graafiline kujutis siin.
Nii et meie dokument koormuste see on meie onload,
Me leiame, et meie otsing nuppu, mis on käesoleva.
Otsime meie nuppu Otsi.
Ja siis, kui nuppu Otsi on klõpsanud vastab see siin.
Onclick.
Siis me lõpuks märku meie kasutaja, mis on see viimane rida siin.
OK?
Nii kõik need neli etappi lihtsalt vastab nelja kastid
seal põhjas.
Kas on mõtet kõigile?
>> Ja siis üks asi, mis ma lihtsalt Rääkimata väga lühidalt, et ma
julgustada kutid minna uurida täpsemalt on
jQuery, mis on vaid raamatukogu mis on ehitatud peal JavaScript.
On super kasulik, sest Kõige rohkem raamatukogusid.
Seal on palju funktsioone.
Nii et kui seal on kunagi midagi sellist mida sa teha tahad JavaScript,
Sinu esimene instinkt ei tohiks mõelda
kohta, "mis funktsiooni peaksid Ma koodi? "See peaks olema,
"Las ma vaatan kellegi seda juba teinud mulle. "
Kuna üheksa korda kümnest, keegi seda juba teinud,
ja nad ilmselt on seda teinud paremini.
Inimesed veedavad palju aega tehes neid, ja JavaScript on väga laialt levinud,
et inimesed on pidevalt püüavad teha seda parem.
Ja jQuery on palju funktsioone et tõenäoliselt kasulik teile
Teie lõplik projekt kui sa oled mittemidagitegemise web design.
Nagu mulle meeldib öelda, "töö targemaks, ei raskem. "
Kui te teete, et see saab olema suur.
Kui me oleme hackathon ma ei tahame, peate olema kõik stressis.
Ma tahan, et sa olla nagu "Ma sain see. jQuery sain tagasi.
Ma ei vaja kirjutada neid funktsioone. "
>> Nii lihtsalt kahte asja mäletan, et ma lähen
teile poisid Vaata lisaks arvesse jQuery ise.
Kõik, mida ma lähen ütlen on see ei päris vinge asja
ja teha oma elu kogu palju lihtsam.
Aga mida sa tahad on, olenemata faili
et sa lähed kasutate seda, sa lähed tahan neid kahte liini.
Sa lähed tahan skript js jQuery dot js.
Ja tegelikult teie allikas saab olema mõned URL.
Kui googeldada jQuery, Google tegelikult võib leida kõik failid sinu jaoks.
Nii et sa kindlasti tahad sisend URL asemel.
Ma lihtsalt panna see siia lihtsuse mõttes.
Kõik see tähendab, on see, kui leida oma jQuery raamatukogu.
See on tohutu, nii et sa ei taha vastuvõtva see oma arvutisse
kui te seda vältida, mis on, miks me kipuvad lihtsalt panna Google URL, et
korraldab kõik need failid sinu jaoks.
OK?
Sa Google'ist, ma luban see on seal.
>> Ja siis mis iganes JavaScript fail, mis sa oled
kasutades, nii et see on vaid mõned väline JavaScript fail, mis te kasutate.
Samamoodi, et me Link meie CSS faile, see on sama asi.
See lihtsalt lingid faili kus teie JavaScript on.
Ja mul on mõned näited lihtsate JavaScript.
Nii me minema läbi.
Ja siis oma indeks JavaScript, mis on Teie JavaScript esitada siin
see on selline ümbris et teil on jQuery.
Sa oled peaaegu 99,9 protsenti ajast läheb
on see teie index.js faili.
Sest mida see ütleb on, "Ei rakenda midagi
kuni teie dokument on tegelikult valmis ", mis on täpselt, mida sa tahad.
Sest kui teie dokumenti ei ole valmis, ja jQuery hakkab asju,
see on lihtsalt jama.
Nii olete alati tahtnud seda ümbris.
Ja siis asju, mis sinna minna, ma jätavad oma poisid enda tutvumist.
>> OK, nii et on olemas küsimustele õige nüüd umbes JavaScript üldiselt?
Või DOM mudelit?
Kui ei, meil on mõned lahedad näiteid, et me ei lähe läbi,
et kutid saavad mind aidata koodi.
Aga ma olen ka kavatse olla super kena, ja kui sa
ei taha midagi öelda Nende, see on hea.
Võin ka lihtsalt anda teile näiteid.
Aga midagi PowerPoint enne astume?
Külm.
>> Ma tunnen, et kutid on vaja energiat.
Nii et ma arvan, et me ei kavatse hakata minu poole Näiteks esimene.
Meil on kolm näidet, teil on oma valik.
Nii et meil on kell, kuhu me läheme rakendada tegelikke kella, mis on
läheb uuendada aja möödudes.
Meil on see suur Twitter funktsiooni.
See-- sa tead, mida, pea vastu.
Me läheme seda minema.
Bam.
OK.
>> Meil on see suur Twitter funktsiooni Siin selle-- Ma tean, eks?
See saab olema suur.
Kas te poisid põnevil?
See läheb loendada märkide olete lahkunud,
nii et kui ma tüüpi kohe, ilmselt ikka näitab 140,
aga me teame, et see nii ei ole.
Ja siis meie viimane siin, kliki siia, et pidutseda.
Mis juhtub on see, kui me nuppu, taustal on
muutu värve.
Nii kutid on oma valikud milline sa tahad teha esimesena.
Ma luban, ma võtan seda väga lihtne teile.
Ma tunnen, et kõik on selline vaid väga väike võti täna.
Nii et ma samm-sammult läbi, kuidas me rakendada kõiki neid.
Kui soovite kellamäng aastal, see on hea, kuid ma
tunne, nagu kõik on natuke väsinud.
Nii et ma lihtsalt juhatab teid läbi need näited.
Kas meil on midagi, mida me tahaksime teha esimesena?
Igaüks?
Eelistus puudub?
OK.
Tead mida?
Me oleme pool.
Ma tunnen nagu te poisid vajavad little-- jah, me teeme pool üks esimene.
OK.
>> Mis meil siin-- see on ei peaks seal olema.
Nüüd on hea.
OK.
Mis meil siin on, lihtsalt HTML lehele
et kutid peaksid olema super tuttav oma kahe viimase psets.
meil doc tüüp siin.
Kas igaüks näha?
OK.
Külm.
Meil on HTML ilmselt.
Meil on mõned päis, mis on seotud -laaditabelite
just minu font kena ja mahukas ja julge.
Nii ei muretse.
>> Meil on mõned keha Id tausta, OK?
Kuna me ei kavatse olla muutes tausta.
Nii et kui me muutuvas tausta meie keha,
mäletame kaks nädalat tagasi kui meil on tegemist veebilehti.
Nii hea on nii.
Ja meil on mõned ID võrdub poole.
See h ref naela tähendab lihtsalt, et see saab minna samal lehel.
Ja kliki siia, et pidutseda, mistõttu kui me näita seda,
see peaks muutuma värvid, õnneks.
>> Ja siis on meil mõned script siin, et on lihtsalt seotud selle partei dot js
faili, mis on tühi, sest me ei ole veel midagi teinud.
Ja see on nii kurb.
Kuid väga kiiresti, siis muutub värvid ja see on fantastiline.
>> Nii et ma lähen lihtsalt kõndida kutid kaudu, kuidas me võiksime läheneda.
Nii et esimene asi, mis me võiksime teha tahad,
kui me muutuvad tausta keha, esimene asi, mida me tahta
tegema, on tegelikult haarata mida keha on, eks?
Nii et me tahame olla summa, meie tausta ja kui te märkate,
Ma lihtsalt automaatselt alusta lihtsalt tippimist.
Ei ole midagi erilist, et me pead tegema meie JavaScript failid.
Ma võin alustada kuulutatakse muutujad, ja kuulutatakse juhuslik ülesandeid.
Ja see on palju vabas vormis.
See on nagu C, andsime teile kõigile Nende raske reegleid, ja sa kasvasid üles,
nii et me oleme nagu "lähevad.
Ole vaba.
Tee, mis tahad. "
Ja see, mida JavaScript on.
Nii et meil on mõned taustal siin.
Meie DOM mudelit, me teame, et me saab teha dokumendi dot saada element,
ja kui märkame siin Meie keha on Id.
Õigus?
Nii saame ei saa dokumenti Id, ja siin on lihtne.
Mis on meie Id et me tahame siin?
Sihtrühm: taust.
ALLISON Buchholtz-AU: taust.
Perfect.
Ja semikooloniga lõpus.
See ei ole kuhugi kadunud veel.
Sul on vaja veel oma semikooloniga.
OK.
Nii et meie esimene.
Ja kui me klõpsake midagi, me tahad, et midagi juhtuks, eks?
Nii et me võiksite mõned muutuja mis on oodanud klõpsuga.
Mida me teeme, on me läheme muuta meie link sarnasemaks nuppu.
Nii et me lähed on mõned nuppu, et võrdub dokumenteerida dot saada elemendi Id.
Ja kui ma räägin kliki lingil või kliki siia, et pidutseda
link, mis võiks minu Id siin?
Partei.
Õige.
OK ei ole liiga halb siiani.
Igaühel saada, mida me teeme?
>> OK, nii et nüüd on meil nuppu, ja me tahame
asju muuta, kui me klõpsake seda.
Nii et kui me mäletame meie PowerPoint, väga lihtne asi, mida me teha saame
on lihtsalt nuppu dot onclick, eks?
Ja see läheb võrdseks mõne funktsiooni.
See on anonüümne funktsiooni.
Ja see lihtsalt kui-- tegelikult ma olen kavatse teha seda veidi suurem.
>> Mida ma just tegin Siin ma räägin, OK,
kui me klõpsake meie nupp, mis on see link, et me lihtsalt nimetatud,
me täita see anonüümne funktsioon.
Meil ei ole vaja mingeid sisendeid.
Me ei huvita, mida kasutaja ütleb.
Kui nad klõpsake seda, et me oleme kavatseb teha mida iganes me tahame,
mis on vahetada taustavärvi.
OK?
Nii et miks meil ei ole mingeid sisendeid, meil on lihtsalt see anonüümne funktsioon.
Ja nüüd me tegelikult toimub kirjutada see funktsioon.
>> Nii et hunnik võimalusi, võib tekitada juhuslikku värvi.
Nii, et ma tegin seda oli luua kolm juhuslike arvude
ja teisendada need RGB kolmekordne.
Nii see lihtsalt näitab teile mõned lahedad asju, kui sa oled nagu, "oh,
Mul on vaja luua juhuslik number. "Kui sa Googled see,
see on, mida soovid leida.
>> Nii et meil on kolm erinevat asju, var, mitte uuesti punaseks, roheliseks.
Õigus?
Nii et need on kolm asju, mis moodustavad värvi.
Sinine, punane ja roheline.
Külm.
Ja mida me saame teha on see, et me teame et see peab olema vahemikus 255,
ja kui te vaatasin mõned juhusliku numbri generaator,
võid saada midagi matemaatika dot juhuslikult, mis, kui te vaatate selle üles
tagasi mõned number nulli ja ühe vahel.
OK?
Ja mis numbrid teeme RGB kolmikud lähevad vahel?
Zero ja mida?
Mida nad minna kuni?
255.
Nii et kui matemaatika dot juhuslik läheb nulli ja ühe vahel,
Kuidas saaks me tahame muuta seda?
Sihtrühm: aeg?
ALLISON Buchholtz-AU: Jah, täpselt.
Nii aeg on 255.
>> Sihtrühm: [kuuldamatu] See on nagu [kuuldamatu].
ALLISON Buchholtz-AU: Math dot juhuslikult.
Sihtrühm: Cool.
ALLISON Buchholtz-AU: Jah.
JavaScript lihtsalt ei hooli sinust.
OK.
Nii saame teha, et kõiki neid.
Õigus?
Math dot juhuslik korda 255.
Kopeeri.
Külm.
Nii asi on, see võib ei tagasta täisarv.
Õigus?
Äkki saaksin number nulli ja ühe vahel,
ja see põhjustab seda veidi off, ja meie RGBs saa olla ujukid.
Nad peavad olema ints.
Nii et kui te olete proovinud seda, Vist mõned ettearvamatu käitumine.
Oleks veidi funky.
Nii et mida me teeme, on me tahame teha kindel, et need on ümardatud,
ja siis võiks ümardada kas nii.
Ma ümardatud korrusel.
Nii et ma alati kindel et see ümardatakse allapoole.
Aga läheb maha, kui lihtne oli lihtsalt saada juhusliku arvu,
kuidas me teie arvates võiks korrusel see number?
See on väga sarnased.
Iga mõte?
Nii et kui juhuslikult oli lihtsalt matemaatika dot juhuslik, et sa arvad, et me tahaks teha sõna?
Math dot korrusel.
Ja sa võid teha ka matemaatika dot lakke.
Round on selline ebamäärane Sest sa ei
tea, kas ümardada või allapoole ümardada.
Nii tavaliselt alati teeme matemaatika dot korrus, matemaatika dot lakke.
Aga honestly--
>> Sihtrühm: Kas korrusel ringi alla?
>> ALLISON Buchholtz-AU: Põranda ümardab allapoole.
Ja see on ainult valik minu poolt.
>> Nüüd on meil kolm numbrit mis on juhuslikult genereeritud,
ja mida me teeme nüüd on meil lihtsalt läheb muuta tausta.
OK?
Nii on meil juba meie taust liiki salvestatud
Selles element nimetatakse taust.
Nii et mida sa märkad on, kui sa mängisid ümber selle,
tahame muuta stiili.
Ja see on omamoodi midagi, siis oleks Google ja nuputada,
meeldib, kuidas muuta värvi.
>> Aga kuidas sa kasutada seda värvi on taust dot stiilis dot taustal.
Nii et see ütleb antud Selle objekti, taust,
mis viitab, et element Id seal,
me ei kavatse vaadata stiilis jooksul stiili,
me ei kavatse vaadata taust.
OK?
Ja kui sa lähed ning otsida selle üles, siis võiks teha natuke rohkem tunde,
aga see on põhimõtteliselt lihtsalt ütlen, "Anna mulle seda väga konkreetset omadust
mida olen varem defineeritud. "
Mida me selle muutmist on mõned RGB, sest see on mõistlik.
Me kasutame RGB kolmikute, eks?
Ja me have-- ma tahan veenduda, ma saada õige mitmeid hinnapakkumisi siin.
Nii et mida me teeme, on meil RGB, ja me lähme
mina-- see on nagu ahel, mis on punane.
Ja siis me tahame mõne koma.
Ja siis me tahame pluss roheline, siis mõned koma, ja mõned sinised.
>> Nii et need plussid lihtsalt mõtlen nagu ahel.
Nii et see on lihtsalt luua selle string, mis läheb piires RGB.
OK?
>> Sihtrühm: [kuuldamatu], pluss siis roheline pluss siis punane.
>> ALLISON Buchholtz-AU: Jah, sest ma messed et üles.
See üks trahv.
Oh, pea vastu.
Ei.
Kuna mul on vaja veenduda, et ma sain kõik need õige.
Nii et ma selgitan uno momento.
Roheline, sinine, täiuslik.
Nüüd ma olen teinud.
Ma usun.
>> OK.
Mis see on, on see, et taust läheb seada mõned string.
Õigus?
Kumb on meil siin.
See saab olema mingi RGB 255 komaga 255 komaga null, või mis iganes number,
on olemas.
Nii et me teeme siin, meil on mõned string.
Ja mida me tahame teha, on meil selline dünaamiliselt luua
et kui me tegelikult programmi käivitada.
Nii et see on mingi string.
Plus konkateneerib seda väärtus, punane on,
mis konkateneerib seda koma, mis konkateneerib see
mida rohelised on, ja nii edasi, ja nii edasi.
OK?
Kuni otsani, mis on sulgev sulg selle RGB siin.
OK?
>> Mis siis, et see saab genereerida mingi käsu tõesti
mis on RGB kolme numbrid Selle taustal on nüüd seatud.
OK?
Vaatame, kas see toimib.
Loodan, et see, sest kui see ei, ma lähen olema reaalne kurb.
Oh ei.
OK, pea vastu.
Kindlasti taustal dot stiilis dot taustal.
Ma olen kindlasti puudu midagi lihtsalt väike.
Kas sa ei poisid vihkan seda?
Kui see on lihtsalt väike väike viga?
Kõikvõimas taustal.
RGB.
>> Sihtrühm: [kuuldamatu]
ALLISON Buchholtz-AU: No.
Üritasin seda enne klassi.
Mul on kõik, mida ma tegin enne klassi puhul ma olin nagu,
"Ootama, mida ma valesti tegin?"
Sest ma olin nagu: "ma ilmselt jama see üles mingil hetkel. "
Plus roheline.
Kõik tundub nagu see on sidumiseks õigesti.
OK.
>> Sihtrühm: [kuuldamatu]
>> ALLISON Buchholtz-AU: Oh, seal lähete.
See, mida ma vajasin.
Vaata seda.
Tiffany päästa.
Perfect.
OK.
Nüüd vaatame, kas see toimib.
Oh jumal.
OK.
Hoia edasi.
>> Sihtrühm: Space pärast teist pluss.
>> ALLISON Buchholtz-AU: Kumb?
Oh oota, pea vastu.
Space kandma?
>> Sihtrühm: Teine pluss roheline ahel.
ALLISON Buchholtz-AU: Oh.
Sihtrühm: Ei ole ruumi pärast plus, jah.
ALLISON Buchholtz-AU: Sa ei pea, et Aga--
Sihtrühm: Oh, sa ei ole?
ALLISON Buchholtz-AU: Tundub päris.
Sihtrühm: OK.
OK.
>> ALLISON Buchholtz AU: Vaatame, kas see töötab.
OK.
Ma ilmselt ei suuda hetkel see demo, mis meenutab mulle
loeng teisel nädalal, aga ma tean, et see töötab.
Ma tean, et see töötab.
Nii lähedal.
Kui ma kogemata kustutatud minu script selle ühe.
Ei, see on pool dot js.
OK hoida.
Ma lähen kopeeri see ning ma olen ka lihtsalt läheb kustutada kõik,
sest mul oli see töö varem.
>> Ma luban, see toimib.
Kui ei, ma näitan sulle, mida Tommy on.
Ja seal.
>> Sihtrühm: Sa viitamine poole dot CSS, ja see on pool dot js.
>> ALLISON Buchholtz-AU: Ah, noh siin on pool dot js.
OK, mida ma teha teisiti?
OK, me näeme, kui see töötab nüüd.
Bam.
Niisiis, ma ei tea, mida ma tegin teisiti, aga see on see, mis peaks juhtuma.
Kinda lahe.
Ma klõpsanud seda, nagu igavesti.
Aga me saame proovida ja näha, mida ma tegin erinevalt, et see oli.
Ma ei tea, kuidas teiega on, aga see tundub põhimõtteliselt mida ma just kirjutasin.
Seal oli ilmselt kadunud semikooloniga kusagil on minu asi.
Tegelikult pärast, ma arvan, et ma oli puudu semikooloniga siin tegelikult.
Aga ma ei näe, sest see oli ekraanilt väljas.
>> Aga kui märkame, et see on päris palju täpselt, mida ma just kirjutasin.
Ma arvan, et ilmselt kõige raskem osa umbes see on lihtsalt selline see asi
siin, mõistmine mida ta teeb seal.
Neid erinevaid asju, mida õppida tõesti ainult Google'i abil ja ausalt
lihtsalt proovida.
Kui te arvate, seal on mõned atribuut, arvatavasti ei.
Nii et proovige seda.
Vaata, mis juhtub.
Nagu ma ütlesin, seal on palju eksperimenteerimine JavaScript,
ja PHP ja kõik, mis kraami, ja CSS eriti.
See on ainus tõeline kuidas seda mõista.
>> OK, nii et pärast seda fiasko koos pidu dot js meil kaks muid võimalusi.
Meil on kella või Twitter.
Nad on nii huvitav.
Võib-olla mitte päris nii lõbus, kui isik mis oli lahe väike vilkumine
asi lõpus.
Kas te poisid on mingeid eelistus?
Sihtrühm: Kell?
ALLISON Buchholtz-AU: Kell?
OK.
Külm.
>> Nii jälle on meil tühi JavaScript faili.
Ja nagu me näeme siin, me on mõned väga lihtsad HTML.
Meil on stiili lehed, mis lihtsalt vormindab, mida ta peaks nägema.
Meil on meie div koos Id kella, mis
lihtsalt ütleb, et "see peaks olema kella."
Ja meil on link meie JavaScript faili
See on tegelikult läheb luua oma kella meile.
Kuna lahe asi on see, et saate seada JavaScript automaatselt värskendada
ise.
OK?
Nii et selle asemel, et oodata kasutaja lüüa Värskenda lehel
nii et saad ajakohastada ajal JavaScript
seda värskendada aga see meeldib.
>> Nii, nagu meie viimane tahtsime juurdepääsu meie tausta, eks?
Mida teie arvates võiks Esimene asi, mida me tahame teha siin?
Kui me mingi läheb maha selline paradigma siin?
Me ilmselt tahad juurdepääs meie kella, eks?
Niisiis, meil on mõned var kell, mis equals--
Mida me siis arvan, et see saab olema?
Dokumendi dot saada osa by-- ma ka armastan Sublime-- Id ja meie Id on kella.
Semikooloniga.
Sain veenduda saada need semikooloniga seekord
sest ma tunnen, et oli probleem viimast korda.
OK, nii, nagu ma just ütles üritab peab olema JavaScript värskendada ennast,
seal on see suur ülesanne, I tean, et see tuli mugav eelmisel aastal
Ma ei ole kindel, et see on mugav seda pset, kuid seda nimetatakse valitud intervalli.
Ja see on tegelikult väga lahe, kui kutid midagi teha
aja või saada ajakohastatud teavet.
On veebilehel lõplik projekt, see on ilmselt
funktsioon, mida soovid saada super tuttav.
Mis määrata intervalli teeb on see, et me ei kavatse anda talle funktsiooni
ja kui tihti peaks nimetame seda funktsiooni.
OK?
>> Nii et kui me lihtsalt läheb luua mõned anonüümseks uuesti funktsiooni,
OK, et ei hakka meie päev ja meie aja
ja seejärel ajakohastada asjad ja näitab seda.
Nii me muretse.
Me oleme nagu genereerida kella siin.
Aga me vajame, kuidas sageli värskendada seda.
Nii et kui see on lihtsalt millisekundit.
Nii et me lihtsalt läheb teha 100 millisekundit.
Muidugi, täiesti meelevaldne.
Kui sa tahtsid seda uuendada palju aeglasemalt, siis võiks.
Me ei jändama Komplektiga intervalli
kui suur meie intervall on pärast saame töötab kell, mis loodetavasti ma tulen
saada.
Nii et see on lihtsalt öeldes: "OK, kõne Selle funktsiooni iga 100 millisekundi jooksul. "
OK?
See on kõik, mida ta teeb.
>> Nii et me tahame, et meie funktsioon teha, on meil tahavad mõned kuupäev
ja mõni aeg on see, mida me ei kavatse olla.
Nii saame alustada meie date võrdub midagi,
ja meie aja võrdub midagi et me ei tea veel.
Või tegelikult, me lihtsalt vaja kuupäeva, sest kuupäeva läheb hõlmata kõike.
Jällegi, kui sa just Google midagi mida sa teha tahad, kui sa kirjutad, "OK,
Ma tahan saada aeg via JavaScript, "see
annan sulle selle suure funktsiooni nimetatakse get kuupäeva.
Sõna otseses mõttes, enamik asju et sa tahad teha,
JavaScript läheb on seda teha teie jaoks juba.
Nii et see on sõna otseses mõttes nagu uus saada kuupäeva, milleks on creating--
või uus kuupäev, rather-- mis tekitab
mingi objekti, mis tähistab kuupäeva.
>> Ja mida me teeme siin see on-- ma kirjutan seda,
ja siis selgitada, mida ta teeb.
Nii et ma teen kindlasti saan seda õigust.
>> OK, nii et mida see funktsioon teeb, on meil lihtsalt
luua HTML, mis on tegelikult lähevad meie div Id kella.
Mis siis, et see saab olla teeme lihtsalt tekitab teatava string, OK?
See on siis saab olema siirdatud meie HTML.
Põhimõtteliselt, mida see saab teha, on olenemata we-- mida ma näitan sulle
on see, et ükskõik, mida me ütleme HTML on, me ei kavatse asendada see tekst siin
kõikvõimaliku HTML on.
Nii see läheb, et võimaldada meil muuta meie kella dot
HTML ole üksnes teksti selle peaks olema kella tegelikult näitab
numbreid ja asju, mida me hoolime umbes, ja tegelikult kella.
>> Mida me teeme, on meil kavatsen alustada teeniva see HTML.
Nii samamoodi, et me kasutasime teha pluss võrdub eest täisarvud
Nüüd saate teha, et stringid, välja arvatud see läheb concatenate neid.
Õigus?
Nagu nägime pool dot js, see lihtsalt konkateneerib kõik need asjad kokku.
Nii saab concatenate erinevate bitti HTML muutujate või bitti stringid
et sa kirjutad välja ise, ja see lihtsalt
tõesti võimaldab dünaamiliselt genereerida HTML, mis on päris lahe.
Nii et kui teil on midagi väga kasutajasõbralik konkreetsed,
see võimaldab teil seda teha.
>> Nii et meil on HTML, et ma lähen proovige ja veenduge, et saan seda paremale.
Nii et me teeme mõned h1 päises.
Mis on oluline mõista siin on, et see on tegelikult lihtsalt HTML.
Õigus?
Me kirjutame tegelik HTML koodi siin, see on
mitte ainult stringi normaalne nii, et me oleks mõelda.
Nii et meil on mõned HTML.
Seda peetakse string siin küll.
Ja me teeme kuupäev dot-- me tahan saada oma tundi.
Jällegi, kui sa olid vaatama kuni midagi kuupäevast,
see oleks öelda, need on kõik omadused, mis kuupäeval on.
Ja siin on, mida saate kasutada seda.
Nii et see on ilmselt asjad saada tundi ja saada minutit
ja saada sekundit ja saada millisekundit, ja kes teab mida veel nad on.
Aga kui sa vaatad dokumentatsiooni, see kõik on seal.
>> Nii et meil on saada tundi, ja siis me tahaks
et concatenate et with-- ma olen kavatse minna seda siin.
Nii et kui me tekitama just nüüd, me oleme tegelikult teeniva aega, eks?
Meil on tundi ja siis milline vahel tundides ja minutites?
Sul on semikoolon, eks?
Nii et me tahame teha mõned semikooloniga siin.
Ja siis me tahame saada meie minutit, nii samamoodi
et meil on kuupäev dot saada tundi, Kuidas saaks me saame oma minutit?
See on sõna otseses mõttes tähtajast dot saada minutit, mis ma selline nagu.
See on nagu "oh, kuidas ma saan minutit? "
Ma lihtsalt saan minutit.
>> OK.
Ja siis on meil veel üks koolon siin.
Ja siis, kui me tahame, et meie sekundit, siis kuidas me saame oma teise?
Kuupäev dot saada sekundit.
Ma arvan, et see on päris lahe.
Ja mis oluline mõistma, et me ka
vaja sulgeda oma HTML tag siin, sest peaks siiski olema kehtiv HTML, nii h1.
Külm.
>> Nii et pärast, et me saame teha kell dot sisemine HTML on võrdne HTML.
OK?
Seega pidage meeles, kuidas ma ütlesin sisemine HTML põhimõtteliselt
võtab iganes on vahel kaks sildid, mis me rääkisime
ja lisab või manipuleerib kõik, mis on olemas?
Nii et mida see teeb, kui läheme tagasi meie kella
on see, et kella viitab kõike jooksul see div.
See on sisemine HTML Selle Id kella div.
Ja nii see läheb ära muuta HTML, et me lihtsalt loodud,
mis mis loodetavasti loodetavasti loodetavasti
näitab aega kohe.
Me näeme.
Muidugi.
Nii palju tehnilisi küsimusi.
Allison on Lihtsalt-- ma olen off minu mäng täna poisid.
OK, mis töötab.
kell dot sisemine HTML.
See oli HTML Kas tõesti?
Ka see, mis juhtub.
Kui sa ei näe midagi, siis lihtsalt pilk oma lähtekoodi.
OK.
Kas sa tahad teada, cool töö ümber et me teeme siin?
>> Sihtrühm: Kas sa trükitähtedega?
Suurtähtedega?
Kuna teil on saada tundi, ja siis saad minutit.
>> ALLISON Buchholtz-AU: See on saada tundi ja get-- oh.
Sa are-- kuldtäht.
See kõik on test, poisid.
Ma luban seda töötas enne klassi.
>> OK, aga midagi lahedat teada on et saate also-- kui mõnikord
väline failid on saada natuke hull,
võite ka lihtsalt panna neid otse siin, mis kipub asju parandada.
Välja arvatud see on nagu tõesti kole.
Muidugi vormindada kõike.
Veenduge, et see kõik on päris.
OK.
>> Tahtsin teha kõik cool demos, ja nad lihtsalt ei toimi.
OK.
Script var kella.
Niikuinii, mis on oluline on et see on üldiselt
et teil oleks vormindada JavaScript.
Nagu näete, see võib olla väga pedantne mõnikord
isegi kui see oli sõna otseses mõttes töötab kaks tagasi.
Või mitte kaks sekundit tagasi, kuid väga hiljuti.
>> Nii, et näidata teile, mis see peaks välja nägema, ja teile näidata, et ma ei ole hull,
ja et kõik on täpselt Sama on see, mida ta peaks nägema.
Sa oled lihtsalt kavatse seda teha ülemine osa siin, ja kui te vaadata lehekülje lähtekoodi,
kui te märkate, ta tegi mõned segasem asju, ma lihtsustas seda.
Samuti krediidi Tommy McWilliam, kes tegelikult
aitas mul luua neid näiteid, mistõttu ma tean, et nad töötavad.
Kuna Tommy on JavaScript master.
Aga kui me märkame, meil on mõned komplekti.
Meil on kella funktsioon siin.
See kõik JavaScript, et me lihtsalt kirjutas, või osa sellest.
Me lihtsalt kirjutasin selle ühe siin.
Ja ta on ekstra funktsioon, mis lihtsalt padjad see
pannes null, enne kui kirja või enne number, kui see on
vaid üks neist.
Nii et kui te märkate, et see on päris palju täpselt, mida me lihtsalt kirjutas.
Teil on muutuja kella, mis on meie element, saada osa ID,
mis on kell.
Meil on valitud intervalli funktsiooni, mis on
anonüümne funktsioon mis täidab kõik.
Meil on mõned hakanud string HTML, mida me siis dünaamiliselt
tekitada lastes mõned h1 päise concatenating
saada koos tundi, pluss Meie koolon, pluss saada
minutit, pluss veel käärsoole-, pluss meie sekundit,
ja lõpuks lõpeb HTML ta.
Ja siis me uuendada meie kella dot sisemine HTML HTML,
ja me ajakohastab iga 100 millisekundit.
OK?
>> Vaata ma luban ma ei ole hull.
Ma ei tea.
Ma ei tea, miks see ei meeldi mulle.
Ma tunnen, ootab sama, kuid ilmselt on see vihkab mind.
>> Vaatame, kui kolmanda ringi läheb paremaks.
Me parasjagu näha.
Ma ei tea, kuidas see läheb minema.
Kas igaüks vähemalt saada miinuseid, nagu lihtsalt üldteema
JavaScript küll?
Loodan, et on vähemalt kasulik, rohkem kui näitab, et see on natuke pedantne.
Aga oma probleemi komplekt on väga lõbus.
See saab olema suur.
See ei ole päris nii tüütu sest see, ma ei usu.
Sa tegelikult saada vaata lahedaid asju.
>> Nii last but not least, püüame Twitter ühe.
Ma tõesti kardan nüüd, poisid.
Ma ei tea, kuidas see läheb minema.
Aga ainult teile vähe rohkem maitset, ja see on tegelikult
stringide ja sisendeid, mida me teeme
on, kui märkame siin HTML-- see üks on natuke more--
meil on mingi tekst ala, mis vastab see tekst ala siin.
OK?
Ja see on Id teksti.
Me restyled see natuke mõned laius ja kõrgus
et oleme ettemääratud, ja oleme H1
mis lihtsalt on meie päis mis esindab meie tähemärki.
Me andsime talle mõned Id kohta tähemärki on veel alles,
ja siis on meil mõned script siin, mida ma olen tõesti
lootes kolmandat korda oma võlu siia, poisid.
>> Mida me tahame teha, samas üldiselt veeni
et me oleme teinud koos kella dot js ja pool dot js nagu me oleme märganud,
on meil alustas tegelikult haarates asju, mida me hoolime, eks?
Nii antud juhul on olemas kaks asju, mida me hoolime, OK?
Üks asi, mis me tegelikult omamoodi uurime ja joonistus andmeid,
ja üks asi, mis me tõepoolest muutub.
Nii et meie HTML.
Kui see on meie veebilehel siin, mis on andmed, et me vaatame?
See saab olla mis iganes Teksti meie karbid, eks?
Mida iganes ma kirjuta siia.
See, mida ma tahan teada, või see, mida ma tahan vaadata.
Ja mis saab olema muutes meie veebilehel?
Tähte veel.
Nii samamoodi, me tahame alustada initializing muutujad
et tegelikult kinni hoida neid elemente.
OK?
Nii et kui meil on mõned var see on meie tekstiväljale
ja meil on mõned var mis on jäänud.
Õigus?
Nii et need hakkavad hoidke neid kahte asja.
Nii sama asi, Dokumendi dot-- OK, ma olen
läheb veenduda, et see on läheb tööle sel ajal.
Ma olen väga veendunud,.
OK, nii et kui me tahame, et meie teksti ala, vastavalt
Meie HTML, mis on meie tunnus?
Mis on meie Id?
See on lihtsalt saab olema teksti, sest see loob meie teksti ala, OK,
ja meie Id on tekst, nii see on kuidas me saame haarata, mis on seal.
OK, semikooloniga.
Ma lähen olema super täpne sellest,
sest ma tahan seda teha sel ajal.
OK, teha sama asja, saada elemendi Id.
Ma tõesti ei tea, mida on põhjustanud teised kaks segi ajama.
OK, siis see üks, Mida me tahame pääseda?
Mis on meie Id siin?
Meil on teise Id sisse Meie HTML, mis see on?
Sihtrühm: Märke jäänud.
ALLISON Buchholtz-AU: Märke jäänud.
>> OK.
Külm.
Nii et ma lihtsalt lähen kirjutan seda väga kiiresti.
Ma lihtsalt kirjutada see teine.
Nii kastis.
Huvitav on B funktsioon-- seal on palju funktsioone, mis mitte ainult
vastavad teie hiir, kuid klaviatuuril.
OK?
Nii saab öelda, millal tahes võti on pressitud, mida saate teha asju.
Nii üks, mis me kasutame nimetatakse peamiste up, mis
ütleb, et "kui olete vajutanud suvalist klahvi klaviatuuril, kui kasutaja on tõstnud
oma sõrme, et nupp, ja võti on muutunud surumata,
siis me ei kavatse midagi teha. "
OK?
Nii et see on mõistlik, eks?
Sest iga tegelane me kirjutame, me ei kavatse
on tõsta meie sõrmedega seda, et kui võti läheb üles,
saame teada, et aland Meie tähemärki jäänud.
>> Nii et meil on mõned võtmetähtsusega üles ja samal viisil,
me ei kavatse öelda, "OK, kui me seda teeme, oleme
ei kavatse luua teatavat funktsiooni kavatseb võtta e, "sel juhul,
ja mida me tahame teha, on arvutada number jäänud.
OK, nii et vaatame lihtsalt alustada luues muutuja.
Nii et meil on mõned muutuja r, mis läheb esindama
kui palju märke me oleme jätnud.
OK?
Me teame, et me alustame 140, ja kui me tahame teada,
oletame, pikkus selle string, mis on olnud sisend,
te poisid on aimu kuidas me võiksime seda teha?
Just põhineb off ilmne asju, nagu siis, kui me tahtsime tundi,
me kasutasime saada tundi.
Me teame, et meie eesmärk on Teksti valdkonnas, kuid sa võisid poisid
mõelge, mis võib tulla pärast seda?
Kõik ideed?
>> Nii et see oli täitsa vähem intuitiivne, kuid see on väärtus dot pikkus.
Nii lihtsalt anna mulle väärtuse atribuut, mis
on tegelikult pikkus string.
Nii see läheb ütlevad: "OK, ma otsin selles kogu string jooksul tekstiväljale
ja ma räägin kui kaua see on. "
Sest kui me mäletame stringid on tõesti ainult massiivid
nii et me saame lihtsalt võtta pikkusega neist.
Nii et meil on nii.
Külm.
>> Siis see, mida me tahame teha, on meil ei soovi võimaldab kasutajal
sisestada rohkem kui 140 märki, eks?
Sest kui me ütleme, nagu "oh, sa ainult nii palju jäänud, "
ja siis lasta neil seda teha Niikuinii, me oleme valetab.
Ja see on veel üks asi, et JavaScript
võib olla tõesti hea jaoks, on kasutaja valideerimine
ja et teie kasutaja mahub eeskirjade
et andsite neile.
Nii et kui sa tahad teha asju teha kindel, et keegi input oma e-posti aadress,
või hoolitsedes, et kui nad sisestage paroolid, nad sobitada.
JavaScript seda teha.
Kas sa teeksid midagi, "kui vorm esitatakse, "vms,
"Kui saadate vorm nupp klõpsatud, kontrollige kõiki neid asju. "
Ja me saame teha, et JavaScript.
Nii et see just see, mida me teeme siin.
>> Mis võiks olla võimalus kontrollida, kas Nad on läinud üle 140 tähemärki?
Mis juhtub Meie väärtus r, kui nad üritavad?
See saab olema negatiivne, eks?
Või see saab olema vähem kui või võrdub nulliga.
Nii saame kasutada, kui see on just nagu kõik muu.
OK?
Ja meil on mingi tekst ala dot väärtus ja mida me teeme siin
on me lihtsalt cutting-- mis see on?
Vabandust.
See üks, me lihtsalt tahame tagasi vale.
Sain segi.
Kõik narmastunud asjadest ei tööta.
OK, me lihtsalt tahame return false, ja siis me
soovite kuvada Ülejäänud tegelased, eks?
Nii kella tegime midagi sisemine HTML, eks?
Kui me seame see võrdne mingi muutuv, nii et mida võiks me siin teeme?
Mida me muutuvas sisemine HTML?
>> Sihtrühm: Järelejäänud?
>> ALLISON Buchholtz-AU: Muudame jäänud.
Hea küll, ja mida me soovite seada see võrdub?
See saab olla r, sest see peaks olema meie tähte veel.
OK?
Nii et ma olen tõesti närvis, et näha, kui see toimib praegu, aga eks näis.
Jäta see.
See on väga kiire.
[Kuuldamatu] OK.
Jällegi, ma lihtsalt lähen näitan sulle.
Mingil põhjusel, minu otsustab mitte töötada,
aga mida ma näitan sulle, et see on-- oh ma pidin panema, et.
OK, märkame samasugust asi siin, saan tekst.
>> Samuti, kui sa poiss teate, kui seal on kunagi midagi sa teha tahad,
ja sa ei tea, kuidas seda teha selle, klõpsa View Page Source,
ja nad ei kavatse öelda.
Vahel pead olema krüpteeritud.
Teie pset, me krüptida kõik, nii see lihtsalt tundub jama.
Aga kui seal kunagi tõesti cool kodulehel, et sulle meeldib,
kui sa lihtsalt käsku View Page Source, see saab öelda, kuidas seda teha.
Nii jälle, töö targemaks, ei raskem.
Ja nagu näete siin kõik need asjad on samad.
see siin lihtsalt võtab mõned substring et ma unustan täpselt, mida see teeb.
Aga see võtab ilmselt mõned substring väärtusest nullist kümneni,
ja tagastab false, mida peaksid lõpetama kasutaja sisestanud enam,
ja siis ilmselt uuendab sisemine HTML seal.
>> Külm.
Nii suur toidu ettetellimine alates tänasest, Eksperimendi vaadata lähtekoodi
sest see läheb, et aidata teil palju, ja igaüks, mõnikord JavaScript
võib olla raske töötada ning ei alati tööd, kuidas sa oodata, et see,
aga lihtsalt üritame sest ma luban ta.
Ma luban, kõik need näited töötasid enne klassi.
Ma ei saa aru, mis juhtus.
Ma sõna otseses mõttes on kõik sama.
>> Üks asi veel, et ma tahan näita kutid, mis võib olla super kasulik
on in-- mis töötas varem?
Meil on pool tööd, ei me oleme?
Ma arvan küll.
Jah.
Me tegime.
Awesome.
OK, nii et üks asi, mis kutid peaks teadma
on konsooli log et ma rääkisin.
Nii lohutada dot logi tere.
Nii et see on omamoodi JavaScript samaväärne printf.
Nii et kui sa kunagi tahad kontrollida oma muutujad
või näha, mis seal toimub, mida mida saate teha on, kui me kontrollida element,
on see, mida sa tahad minna to, ja lähete lohutada,
näete, et see trükitud tere.
>> Nii et me võiks olla see print iganes me tahame.
Kui me tahtsime seda trükkida tausta dot stiilis dot taustal
peaksime suutma näha RGB triple, mis kerkib.
Või mitte.
Ma unustan, kuidas täpselt prindi muutuja niimoodi,
aga sa peaksid olema võimeline välja printida asju.
See on väga kasulik Sinu pset, kui
üritad manipuleerida koordinaadid või tühi-tähi.
Nii nad muuta ka tükk klassis.
See erineb viimastel aastatel nii lihtsalt tore oma TF või TF
kell tööaega pigem sellepärast, et me oleme selline õppimine koos teiega.
Aga konsooli log oli super, super kasulik JavaScript eelmisel aastal.
Nii armastan seda.
Õpi, kuidas seda kasutada.
See on lihtsam kasutada kui GDB, et peaks olema vähemalt pluss punkti.
Aga aitäh poisid kannavad minuga.
Mul on kahju, et minu näited mingil põhjusel
lihtsalt ei taha minuga koostööd, kuid ma
loodan, et see aitas selline sulle veidi rohkem tsoonis JavaScript.
Ja saatke mulle kõik oma küsimused Järgmisel nädalal, et mind oleks super remonditud,
ja ma toon kommi ja isegi extra kommi, sest see oli naeruväärne.
Aga kutid on suur, ja on fantastiline nädalas.