>> JASON Hirschhorna: Dobrodošli, vsakdo, za devet teden.
Imamo razburljiv teden pred nami saj imamo končno problem niz.
Imamo tudi povsem nov jezik, JavaScript, da ste že v
Sredi uporabljajo ne le za to Problem set, vendar mnogi od vas bo
Verjetno ga uporabljajo za končno projekti, zlasti
spletne končni projekti.
Tako da je tisto, kar bomo šli čez danes po na kratko govoril o virih,
, ki mi vsak teden.
Bomo skok v JavaScriptu, in nato bomo porabili vse prerez
hands-on aktivnosti kodiranja Dolphin Trainer 2K13, ki je kot Madden
2013, vendar za delfine in v JavaScript.
>> [SMEH]
>> JASON Hirschhorna: Tako kot vedno, seznam sredstev za vas, da preverite.
Ti viri so še posebej pomembna ker naslednji teden na
Sreda kviz eno, vaša druga in končno kviz v tem tečaju.
Tako kot kviz ničlo, je 75 minut in se začne malo po 01:00.
To zajema vse od prvega dne ničelno Cilj tega predmeta, vendar pa zagotovo
poudarja, vse, kar ima se je zgodilo, ker kviz eno.
>> Seveda pa smo pokrili for zanke v začetku leta.
Za zanke so verjetno še vedno dogaja, da biti del tega kviza, tako da ni
kot si lahko ignorirati vse, se je zgodilo pred petimi teden ali kvizu ničelni
ker to seveda gradi o sebi veliko.
Zagotovo pa bo poudarek na Stvari smo se naučili od šestih teden.
To vključuje PHP, JavaScript, SQL se prepričajte, in tudi bolj napredne
podatkovne strukture smo govorili v C. Cela kopica drugih temah, vendar pa smo
bodo o tem razpravljali prihodnji teden kot smo pregled za kviz.
>> In prav tako, kot vedno, če imate vprašanja o kvizu, kot ste
pripravo, vas prosimo, da pošljete svojo pot.
Zdaj, ali kdo ima katero koli Hitre vprašanja o kvizu?
>> OK.
Ni treba skrbeti za to, ali čudak izvedeli zdaj, ampak da se vodijo v
nazaj v tvoji glavi, ker je to dogaja en teden in en dan od zdaj.
>> Končno, vem, da smo teče proti konec semestra -
obstajata samo dve poglavji, ki ostane po to - ampak jaz sem še vedno navdušena in
poželjiv za vaše mnenje če imate.
Želim, da bi tisti, Najboljši dve poglavji doslej.
Verjetno bo, saj je vsaka poglavje je neverjetno in najboljša doslej.
Ne vem, kako je to mogoče, vendar oni vsi bili fantastični, mislim.
>> Povratne informacije sem prišel je prikolica off nič in nihče, saj za
Zadnjih nekaj tednov, zato vas prosimo, da me nekaj povratnih informacij, če ga imate.
To traja tri minute.
Mi lahko poveste dobre stvari vas Želiš, da delaš ali
Stvari lahko delam naprej.
Trudim se biti najboljši učitelj mogoče, ali pa bom poskušal narediti najboljše
Ne morem, ampak jaz ne morem storiti, če ne bom vem, kako vi počnete.
In to je težko povedati, zakaj ste se uvršča spi v razredu, zato mi dovolite,
veš, potem zakaj je bilo tako.
>> Jaz sem ti pokazala sliko prejšnji teden.
To je Teenage Mutant Ninja Turtles kolo sem imel, ko sem bil mlajši,
in smo še naprej prizadevati Vidva brez koles usposabljanja, kot smo potopiti
ste v drugem jeziku.
Vendar prepričani, JavaScript, kot so PHP, je zelo podobna stvari, ki ste jih
v preteklosti.
Veliko logike prenese več, če Ne skladnja, natanko eno za ceno ene.
Ampak še enkrat, vse te jezike, ki smo šli čez v zadnjih nekaj
tedne, čeprav se zdi prepričljivo, so neverjetno močna in bo omogočal
da narediš veliko v zadnjem projektu in verjetno druge spletne strani, ki ste
koda v prihodnosti.
>> Torej, brez odlašanja, gremo začeti potapljanju v JavaScript.
Bomo govorili o tem na kratko in potem pa res dobil v hands-on
kodiranje dela tega oddelka.
Torej JavaScript je scriptinga jezik, kar pomeni, da je
razlikuje od PHP, in to je drugačna kot je C. JavaScript ni sestavljeno in
to ne izvede strežnik.
Namesto, ga vstavite.
Naložite JavaScript stran, ko boste naložili spletna stran, nato pa ga izvede
na vašem računalniku.
Kar pomeni, da si lahko ogledate vse JavaScript kodo, ki je bila
poslano na vaš računalnik.
>> Včasih je to skrajša ali kodirani a bit, šifrirano malo, tako da boste
Ne morem izrecno povedati, kaj se dogaja.
Na primer, če si želiš ogledati CS50 ali Rešitev osebje za ta teden
problem določiti, in greš na service.js, boste opazili, da ne more dejansko povedati
kaj narediti iz tega, kar vam bomo dali.
Šifrirano smo ga malo, da bi da je malo težje.
Kljub temu si lahko ogledate natančen JavaScript datoteka, ki smo izvršitve
in naš program teče naprej.
Torej, to je tisto, kar pomeni, da je client-side skriptni jezik.
>> Podobno kot pri C in PHP, čeprav, JavaScript ima za zanke, če / drug
pogoji, medtem ko zanke.
Podobno kot v PHP, ima foreach zanke, kot dobro.
In spet zelo podobni skladnji, ki smo jih videli v
jeziki, ki smo jih že delal.
>> Končno, eden izmed najboljših delov JavaScript in kaj bomo
delaš veliko danes, in verjetno boste se delaš veliko s svojim P set, če ti
ga niso doživeli že, si ti Lahko preverite vse napake, ki jih imate
v kodi preko Konzola JavaScript.
Pogledali smo pri tem malce prejšnji teden.
Ogledali smo si drugo vrsto konzole pregledati stran, ampak v
Chrome, še enkrat, si lahko ogledate postavitev, HTML, dokumentiranje, da je vaša stran
vam prikazuje na zaslonu.
Prav tako si lahko ogledate vse JavaScript tvorijo to stran in si lahko tudi kot
Rekel sem, da vidim vse napake v Konzola JavaScript.
In bomo doživeli, da bolj bit, ko smo začeli pisati.
>> Ena stvar, da opombo o JavaScript spremenljivke.
Kot so PHP spremenljivke, oni ohlapno-tipizira, tako da vam ni treba
jim dajejo posebno vrsto.
Po obsegu, da je opredeljena z "var" ključno besedo.
Torej, če ne boste dal ključno besedo pred nečesa, si napisati ime
spremenljivke, nato odstop operaterja, v tem primeru enačaj.
Jaz pozabljam podpičjem tam, vendar Predvidevam, da je podpičje
tam.
>> Potem ste ustvarjanje Globalna spremenljivka.
Če si dal "var" ključno besedo, nato ste mu daje neko vrsto lokalnih
področje, pa naj bo to na funkcija ali zanke.
Tako, da je ena stvar, da Upoštevajte, za spremenljivke.
>> JavaScript je jezik.
jQuery je knjižnica zgrajen na vrhu jezik JavaScript in imate
ga prej videl v predavanju.
Priporočam, če boste uporabljali JavaScript v vašem finalu
Projekt, ki ste spoznali jQuery.
To naredi vse, kar hočeš storiti še veliko, veliko lažje.
Prav tako prihaja s čudovito dokumentacijo in primere, da bi dobili
ste začeli.
Danes se bomo, da bo uporabo jQuery, kot dobro.
>> To, kar imam na tem diapozitivu, so zelo osnove jQuery.
Na vrhu HTML datoteke ali karkoli - vaš index.php datoteko, vaš
index.html datoteko - morate vključitev teh dveh linij.
To so precej splošne linije.
Prva vrstica vključuje jQuery JavaScript datoteke, in druga vrstica
vključuje kjerkoli ste napisali svojo kodo JavaScript.
In seveda, ker v vašem JavaScript kode, ki ste jo verjetno uporabljali
nekateri jQuery funkcije knjižnice, da mora iti po
script vključitev jQuery.
To bomo raziskati spet v trenutku.
>> In končno, v datoteki JavaScript, Temu pravim ena index.js.
Lahko bi bilo scripts.js.
Karkoli že je, karkoli JavaScript Datoteka ste, boste začeli splošno
s to vrstico kode, znak za dolar odprte paren, dokument, v bližini paren,
Obdobje, pripravljen, odprta paren, funkcija, odprte paren, v bližini paren, nato
kodrasti brace.
Vrgel svojo kodo notri, in potem zaključite s kodrastimi naramnicami, blizu
paren, podpičje.
>> Torej, vzemite to kot dejstvo.
Če vas bo z uporabo jQuery, zaviti vse kode jQuery znotraj
ta vrstica kode.
In bomo spet videli, da v sekundi.
>> Spet bomo delali s jQuery, in prosim, postavljanja vprašanj, kot gremo
danes, vendar pa še kdo kakšne Vprašanja o jQuery ali
JavaScript zdaj?
>> OK.
Torej, brez odlašanja, bom predstavil za vas Dolphin Trainer 2K13.
Jaz sem super navdušen nad to zadnjo različica izdelka.
>> Oh, ne!
Bila sem navdušena.
Hotel sem pokazati, da vas fantje, ampak izgleda, da imamo ne
jo izvajajo še.
Naj bo to malo večji.
Torej, če sem naložiti kodo za Dolphin Trainer - to presneto.
Žal mi je, fantje.
Delal sem na to pred razredom.
Mislil sem, da so jo končali, ampak mislim, da imam še vedno nekaj
dela še treba storiti.
Ampak na srečo, vi vsi imajo nekateri JavaScript in jQuery praksa, da
gremo naprej in se konča Ta skupaj.
>> Mislim, da sem poslal vidva kopije tega ker sem bil zelo navdušen
o tem, da bi morali imeti Isto kodo, ki jo imam.
Pojdimo v -
dang je, fantje, žal mi je.
Pojdimo v terminalu, čeprav.
>> Tako kot pri vašem zadnjem problem kompleti, če so moji -
Naredimo to malo večji, Tudi za vas -
si mi vzela zip datoteko.
Domnevam, da jo razpakirati.
Greva tukaj.
In potem upam, da ste se preselili v Enako imenik, kamor ste shranili
tvoj problem določiti osem kodo.
In smo prihranili v tem imeniku, da bom lahko dostop do njega - ali pa bomo vsi lahko dostopate
koda v brskalniku Chrome na našem računalniku.
>> In še enkrat, da pridete do te kode, preprosto vnesite naslov najdete na
dno, desna stran aparata, tu dol.
Boste našli vaš IP naslov.
Vnesete, da v brskalnik Chrome na vašem računalniku, in v tem primeru,
ker smo oddelek devet mapo moramo tudi, da dodate
slash poglavje devet.
>> Naj me -
oops.
Jaz bom to zmanjša, tako da ne morajo voditi tako, da kliknete skozi to.
>> Torej, to je, kako sem ustanovil to kodo.
To sem že naredil, da je že.
Ne bom šel skozi tiste koraki, ker to je tisto,
začetek problema določi sprehodi vas vodi skozi, kako to storiti.
Tako da gredo naprej in boste dobili nastaviti to up na sekundo, ampak najprej dajmo
raziskati to kodo kot skupina.
>> Poglejmo, kaj sem storil.
Poskušal sem, da se večina tega storiti pred razredom, ampak mislim, da sem
je malo zadaj.
Torej, kaj je odprla index.html.
>> OK.
In index.html je zelo enostavna stran, ker nisem
želijo, da bi dobili preveč nor.
Resnično sem želela, da se prepričajte, da je delal, ampak mislim, da sem
ni dobil tako daleč.
>> Tukaj je glava, ki prihaja prav znotraj teh oznak HTML in opazimo
Nekaj ​​stvari pravico off kij.
Imamo pravico, da CSS datoteke tukaj in primerno
Mesto datoteke CSS.
Imamo knjižnico jQuery tukaj, in boste opazili nekaj drugačnega
o tem.
Vir je nekaj res, res dolgo.
ajax.googleapis.com/--
nekako izgleda kot URL-ju, vendar je ne vsekakor izgledal
js / jquery.js.
>> In to zato, ker sem se odločil, da bom Ne želim, da se morajo prenesti
jQuery datoteko in jo povlecite in shranite je v moji knjižnici, in se
odgovoren za to.
Namesto tega bom samo, da sprejmejo JavaScript datoteke, ki jih Google gostitelji.
Tako Google dejansko gosti številne knjižnice, in jQuery, saj je ena
izmed najbolj priljubljenih, saj gosti da kot eno dobro.
>> In zato, ker je to gostovanje, ne vem morajo skrbeti za to, in
posodobiti, čeprav, kadar ti ga dopolni Verjetno bom moral zamenjati te
Številke tukaj.
Ampak to je samo, da bi moj celoten spis Sistem malo manj čist.
Res ne všeč gostovanje Vse te datoteke.
To je veliko lepše, če Google je, da jih gostijo zame.
Torej je to, še enkrat, je pridobivanje celotno JavaScript datoteke, ampak to je samo da
Google namesto na gostuje my Datotečni sistem na mojem računalniku.
>> Prav tako smo videli, da sem dal v dva files dolphins.js in trainer.js.
Bomo pogled na tiste v sekundi.
In končno, ta naslov tukaj.
Kdo mi lahko pove, kaj je ta koda notri ta naslov oznake, kjer
da gre na moji strani?
>> PUBLIKA: Kot tisto stvar, ki Orodna vrstica ali karkoli?
>> JASON Hirschhorna: Ja, malo tab na vrhu okna krom.
To je, če to besedilo gre.
>> Znotraj telesa, kot si lahko glej, ni veliko stvari tukaj.
Imam samo tri divs.
Sem jim nekaj ID, in Sem dal malo besedila noter
Ampak mislim, da je, zakaj ne bomo glej kaj sem.
Pravzaprav smo videli Dolphin Trainer 2K13.
Vidimo TODO.
Ne vem, če ta prihaja iz ker jaz ne vidim, da je tu.
Mogoče, da je v enem od Moje JavaScript datoteke.
Preverili bomo, da v sekundi.
>> Mi lahko kdo drug pove, kaj To pomeni, ID tukaj?
>> PUBLIKA: To je način kliče poseben oddelek v [neslišno]
datoteko?
>> JASON Hirschhorna: Ja.
To je samo način, da reference To zlasti div.
ID-ji so v najboljšem primeru edinstven.
OK?
Tough množica.
Torej, ID-ji so ponavadi edinstvena.
Jim daš na eno specifično element v kodi.
>> Kaj pa, če sem hotel na referenčno številko elementov, pa naj bo to za CSS
styling ali jQuery?
Kaj atribut lahko jim dam?
>> PUBLIKA: Class.
>> JASON Hirschhorna: razred, točno.
Prav.
>> OK, tako index.html, še enkrat, ni veliko dogaja.
Torej, kaj je odpreti drugo datoteko.
Poglejmo, kaj imam.
To je vse, kar imam tukaj.
Pojdimo v mapo JS.
Ne bom skrbeti CSS za zdaj.
Odprimo dolphins.js.
>> Ups.
Oziroma -
OK.
Torej, dolphins.js, da dejansko izgleda precej podobna nekaterim kodo, ki jo
bila dana v problem določiti osem.
Ko se pomikate po njej.
Mi lahko kdo pove, čeprav kaj je DELFINI?
To vse kape DELFINI?
Kaj je to?
Kakšne podatke pa je to?
>> PUBLIKA: Array.
>> JASON Hirschhorna: To je niz.
In vemo, da je matrika, ker sem vidim te oglatih oklepajev tukaj.
In nekdo drug, kaj je to paleto?
>> PUBLIKA: Predmeti?
>> JASON Hirschhorna: To je nabor predmetov.
In lahko vidite, da.
In kako veš, da je paleto predmetov?
>> PUBLIKA: Ker imate to debelo črevo boot med zavitimi oklepaji?
>> JASON Hirschhorna: Right.
Tako da imam te zavite oklepaje tukaj, in potem si lahko ogledate na vejico
ločevanje drugačen predmeti v tem polju.
In nato znotraj vsakega predmeta, imam Nekaj ​​debelega črevesa in nekaj drugega.
In kaj je na splošno ta prvi del, stvar na levi debelega črevesa?
Kaj naj reče?
Generično?
Kako smo se nanašajo na to?
>> PUBLIKA: Indeks?
>> JASON Hirschhorna: Indeks, ali verjetno bolj splošno, ključnega pomena.
In nato na desni roki stran, vrednost.
Torej indeks, ključnega pomena.
Ampak, če govorimo o tistih, smo na splošno pomeni stvar na
levi strani.
>> V preprosti matrike, spet smo imeli indekse 0.
1.
2.
3.
4.
In delfinov, bomo imeli delfina 0, delfini 1, delfini 2 delfini 3,
delfini 4.
Imamo tudi, znotraj tega predmeta, smo na splošno ne bo reference stvari.
Ali pa, če imamo samo ta predmet pravice tu, mi ne bo rekel predmeta 0,
objekt 1, 2 nasprotuje.
Mi boš rekel ime predmeta, ali tip objekta, dolžina objekt, et cetera.
In to je, kako bomo dobili vrednost na desni strani.
Torej, če smo rekli ime predmeta, na primer, mi bi dobili ta niz,
"Grace".
>> Tako kot so fantje povedali mi, delfinov je preprosto paleto predmetov.
In boste videli vse predmete imeti ime, vrsto, rod.
Je to pravilno izgovori?
Kdorkoli?
Rod?
Super.
>> Dolžina, teža.
Je to pravilno izgovori?
Mislim, da ja.
In slika, samo URL do neke datoteke na spletu.
In prav tukaj, zapremo niz, tam spodaj v zelo levo roko
stran od mojega zaslona.
Tako, da je vse dolphins.js je.
>> Oh, moj bog.
To vse pojasni.
Mislil sem, da bi propadli vse, ampak videz.
Obstajajo vse te todos.
OK, upam, da bomo lahko anketirani skupaj.
Ampak najprej dajmo, preden storimo da, samo sprehod skozi
ta koda zelo hitro.
>> Torej, kot sem že omenil, smo videli na zelo začenja to linijo, ki sem ga imel v
tobogani, (dokument). pripravljen (function ().
In v bistvu tisto, ki se dogaja, da se je počakati do vsega v vašem
strani, ki je obremenjen, zato počakajte to je vse matrika, vse je dobro, da
iti, nato pa začeti izvršitve to kodo.
Torej, če je potrebno teči nekaj PHP, če ste potrebovali, da bi dobili nekaj slik,
karkoli že je, je bilo vse kode set in pripravljena iti v stran s kazalom
ali karkoli Stran je bila naložena, in zdaj ste tekoč, da začnete
izvršitve svojo kodo.
>> Torej prva stvar, ki mi je smo postavili ta niz.
In nimam VAR ključno besedo tam, tako da tisto, kar je
Obseg te matrike?
>> PUBLIKA: To je globalna.
>> JASON Hirschhorna: To je globalna, zato ocean_array je mogoče dostopati iz
kjerkoli v tem dokumentu.
>> In potem vidimo to zanko.
Da ne rečem foreach, vendar je to je v bistvu foreach zanke.
In to je šele verzija Javascript, Tako za vsak var delfina v delfinov
Kaj podatkovni tip?
Čeprav, še enkrat, JavaScript ne imajo ti tipi podatkov samo po sebi, kaj
podatkovni tip je delfin?
>> PUBLIKA: objekt.
>> JASON Hirschhorna: To je cilj.
Smo dobili vsak predmet v matriki delfinov.
Torej, tukaj je videti, kot da sem pozabil dal vse od teh delfinov, od našega
Orjaški DELFINI mislijo na ocean_array, zato bi morali storiti
, ki je prvi.
>> In potem, kar se imenuje ta bazen spremenljivka.
Jaz sem jo nastavite na null.
In potem sem poklical to funkcijo draw_ocean.
Treniram delfina, ko njegov Slika je kliknil -
Jaz tega še niso storile, da - in nastavite FREE delfinov, ko
gumb kliknili.
>> Torej, to so stvari, ki jih moram narediti.
Mislim, da bi ti dal nekaj ozadje na tisto, kar sem poskušal narediti.
Torej, če gremo tukaj, kaj sem hotel to izgleda kot je bil niz up
Tukaj, kot je rekel "nedokončano" I Hotela tabelo, v bistvu, s
Slike vseh delfini.
In potem, ko boste kliknili na eni sliki, Želel sem, da bi ga dol v
spodnja polovica zaslona in dobimo si vse informacije o njej, in
da bi delfinov v bazenu, delfin ste bili usposabljanje.
>> Pa sem mislil, da bi bilo res kul.
Imate vse te delfine v ocean tu gor, potem kliknite na eno,
in bi šel v bazen, in potem bi jo vlak.
Tako da je tisto, kar sem poskušal narediti.
In potem bi bilo gumb tukaj v bazenu, in lahko kliknete,
podobno, "osvobodila", in lahko nastavite delfinov brezplačno, in da bi šel nazaj
v ocean.
>> Tako da je tisto, kar sem poskušal ustvariti, ampak spet, bom potreboval vašo pomoč
jo ustvarili.
Torej, upam, da nekateri od teh ključnih besed ali bodo nekatere izmed teh izrazov začetek
osmišljajo zdaj v okviru tega programa.
>> Pustimo videti skozi te datoteke.
Temu pravimo funkcijo draw_ocean.
To je ena in edina funkcija pravimo Iz document.ready oddelku.
Zato pravimo draw_ocean funkcijo, in izgleda, da ustvari niz,
spremenljivka, tukaj.
Dal nekaj v nizu, dodaja več stvari na vrvico, dodaja več
stuff niza, in potem je ta vrstica kode.
Jaz pravim, da natisne HTML niz.
In nekdo razloži mi, kaj ta vrstica kode počne?
No, najprej, kaj počne da znak za dolar pomeni?
To ni PHP spremenljivka, ampak kaj to znak za dolar pomeni?
>> PUBLIKA: Povezovanje v HTML-ID -
to je, kot da se povezuje z HTML kodo?
>> JASON Hirschhorna: Kaj pa da znak za dolar?
Kaj to znak za dolar kažejo?
>> PUBLIKA: Povezovanje v HTML nekako?
>> JASON Hirschhorna: Kje smo bili priča to znak za dolar, preden v JavaScript?
Videla sva v predavanju.
Pogovarjala sva se o tem.
Kaj pomeni znak za dolar pomeni?
>> PUBLIKA: Nekaj ​​s jQuery?
>> JASON Hirschhorna: Točno tako prav.
To je nekaj storiti s jQuery.
Ta znak za dolar pomeni rabim jQuery knjižnico funkcija tukaj.
Točno tako.
>> Tako smo napisali znak za dolar, in nato imamo to odprto in zaprto paren
paren, in tam notri, kaj se dogaja tam notri, ko ga uporabljate
jQuery knjižnico funkcijo, ali ste uporabo knjižnice jQuery?
Še enkrat, da ste videli to predavanje.
Lahko nekdo izročiti mi - in vi videli tudi nekaj tukaj.
Kaj se dogaja v notranjosti tam?
>> Jeff, daj mi ugibati.
Kaj je to podobno, # ocean?
Kjer smo videli, da je pred?
>> PUBLIKA: Je knjižnica ali kaj podobnega?
Nimam pojma.
>> JASON Hirschhorna: No, pa mi odpreti indeksne piko -
nope, napačno mesto.
>> Tako vidimo, da imamo nekaj imenuje ocean tukaj.
Kje smo videli # ocean hashtag ocean, sintaksa prej?
Ja?
>> PUBLIKA: CSS?
>> JASON Hirschhorna: V CSS.
Zato smo želeli nekaj slog, ne pozabite, mi bi dal hashtag CSS
izbirno, ali hashtag Ocean, npr in vse od oblikovanja
da smo želeli dati stvari z ID oceana smo dali notri.
>> Torej, tu notri ni CSS Selektor gre tukaj.
jQuery opredeljuje sama vrsta selektorjev.
Ampak to je isto idejo, in dejansko Veliko jih prekrivajo z CSS.
Tako znotraj teh odprtih oklepajev, ki jih dal selektor, in ne glede na
Selektor nanaša, to je tisto, boste uporabljali.
>> Torej, v tem primeru, sem izbiri ID ocean.
Če bi imel predavanje -
recimo, da imam razred stvari imenovane "slike", in sem dal, da bi
Veliko elementov, kako reference razred stvari, ki se imenuje "slike?"
>> PUBLIKA: Mislim, da je pika.
>> JASON Hirschhorna: Z piko.
Torej, če namesto tega sem dal slike dot tukaj, da mi ne bi bilo razred
Stvari se imenuje "slike".
>> Seveda, to je super močan, in se lahko sklicujete na veliko stvari.
V bistvu bi lahko reference bistvu koli tag v HTML.
Torej, če sem hotel to storiti, td, da je tag da smo videli prej, ko
izdelava tabele.
Vi ste verjetno seznanjeni z da iz P določi sedem.
V tem primeru se dejansko dogaja Izberite vse od njih.
To se dogaja, da mi niz vseh td tags.
Ampak da lahko dobite malo veliko, Tako amo zdaj smo
dogaja, da se držijo samo navajanje ID.
>> Torej, kaj to počne, še enkrat, je da postane v tem primeru -
Žal mi je.
Pojdi tukaj, index.html.
To je ocean, namesto ocean ID sklicuje div, tako da ta del
vrstica kode dobi ta div.
>> In potem je ta pika pomeni, kličem funkcija in ime, ki
funkcija je HTML.
In to je okrajšava za, če vi videli pred, znak za dolar, dokument, dot dobili
element z ID, dot notranjo HTML.
To je le različica jQuery je.
Torej funkcija HTML samo dobi notranjo HTML.
Tega elementa.
Torej, še enkrat, če se ozremo nazaj, se bomo glej ni notranja HTML.
In tako, če sem to storil, bi jaz se trudijo, da bi dobili HTML.
Ko to pišem, sem nastavitev HTML.
Torej sem mimo to funkcijo za vrvico, niz, ki sem jih ustvaril
tu, in rekel, da je dal notranjosti oceana div.
Ja?
>> PUBLIKA: Ko prideš HTML, ki ste ga pravkar dobili
kopija, če je, kajne?
Ne boš ga odstranite.
>> JASON Hirschhorna: Right.
Če bi to storil, in je želel to razen v var -
oops.
, Da bi dobili vse informacije, ki je bil tam in ga shranite v drugo
spremenljivka, naredite kopijo.
>> PUBLIKA: OK.
Imam jo.
>> JASON Hirschhorna: Tako smo ustvarili nekaj HTML, le da v nizu.
Smo prihranili nekaj več.
Tukaj lahko vidite, da Todo niz.
, Tako da je verjetno, kje smo dobili, da TODO od trenutka, ko
gremo na naši spletni strani.
In dejansko, če sem desni klik na todo, pregleda Element, smo se pogovarjali o
ta teden.
Tako smo lahko videli HTML Struktura naše strani.
>> Opazili boste, da je tukaj -
Naredimo to malo večji, preveč -
imamo div ID ocean tukaj.
Vsi so videli, da vrstice kode?
In to je tisto, kar smo tipi v index.html.
>> V njem vidimo zdaj to miza vrstica kode.
In kaj to tabelo vrstica kode je, To je številka, smo pravkar vstavili v
ta element.
In to gledamo v njem, ne bomo nikoli natipkan colgroup in tbody.
, Ki je bila dodana za nas, ker smo naredili nekaj fancy stvari.
Vendar boste opazili, da je tr, tam je td z Todo.
>> Tako da izgleda kot, spet, kodo, ki smo pisali tukaj.
To je točno, kaj je to Linija je bila počne.
Pri čemer je bil naš HTML niz in ki ga je dala v notranjosti DIV tukaj.
Sprva nima nič.
Ta stran gets naložen.
Znak za dolar, document.ready.
Ta se začne izvršitve.
Kličemo funkcijo draw_ocean, in znotraj draw_ocean funkcijo vzamemo
to HTML in ga dal v tisti div.
>> Pravkar smo šli skozi veliko tam.
Ima kdo kakšna vprašanja o tem?
Ali pa, kako to deluje, ali jQuery?
Ker če razumete to, potem jQuery upajmo prišel
relativno enostavno.
Ja?
>> PUBLIKA: Kaj ste imeli v notranjosti oklepaju pod izpisu HTML
Niz, ki je ime HTML spremenljivka, ki jo
so napovedali že prej?
>> JASON Hirschhorna: Ta pravica je tu?
>> PUBLIKA: Da
>> JASON Hirschhorna: Da.
PUBLIKA: Torej, če je imenovan, da nekaj drugega, da je nekaj drugega
je bilo tisto, kar bi si dal noter.
>> JASON Hirschhorna: Točno tako prav.
In to je dobro izhodišče.
To je malo zmedeno, ker Imam HTML, html.
To notri je ime mojega spremenljivka, in to tukaj, je
Ime funkcije jQuery.
>> PUBLIKA: Ampak, da za jQuery deluje za delo, boste morali dati to
nekatere HTML vhod?
>> JASON Hirschhorna: Točno tako.
ALI moraš dati to niz.
To bo dal ta niz v notranjosti v div ali karkoli.
To je le niz.
Da ne ve, da je to HTML, vendar Očitno ga oblikujte v namen, da se
veljaven HTML.
Je to odgovor na vprašanje?
>> PUBLIKA: Da.
>> JASON Hirschhorna: OK.
Ja?
>> PUBLIKA: Kaj pa, če ocean iz na gumb ali kaj podobnega?
Kaj bi. Html storiti?
Bi to spremenilo Besedilo gumba?
>> JASON Hirschhorna: Torej, vprašanje je, Kaj pa, če se je sklicevala na gumb?
To se bo spremenilo notranja HTML nečesa.
Torej, če ima odprto oznako in tesno tag, bo dal nekaj vmes
odpiranje in zapiranje tag.
Če ni odpirajo in zapirajo tag, da ne bo storil ničesar.
>> PUBLIKA: To je dobesedno kopija in paste takšne stvari?
>> JASON Hirschhorna: Ja.
It kopira in prilepi nekaj iz karkoli spremenljivka sem mimo,
Niz sem mimo, znotraj tistih, odpirajo in zapirajo oznake.
>> Oglejmo si tukaj.
Oh, moj bog. draw_pool ni storiti ničesar tam.
To je lenuh.
Vlak, wow.
OK, tako da ni nič drugega razen tega, da.
>> Torej, začnimo, in spravimo to gor.
Bom morali vsi so pomaga, da se to stori.
Obstaja dejansko ni, da je veliko vrstic kode, mislim, da bi napisali.
Mislim, da je pred nekaj leti sem to naredil za različico 2K12, in tam
ne sme biti, da je veliko vrstic kode za pisanje.
Ne bi smela črtati to kodo.
Moral bi samo rešil.
Oh, noro.
>> Kakorkoli že, pa začnimo.
Torej sem v tej matriki, ali sem v tem linijo, in imam ocean_array.
In hočem, da dajo vse to, vse, kar je iz tega spisa, v mojem
ocean_array.
Torej, kako lahko vzamem vse od tam, in ga v
ocean_array?
To je ena vrstica kode.
Kdo mi lahko pove, da vrstico kode ali Povej mi, kakšno idejo, kaj to postavo
kode je treba storiti?
Zakaj ne bomo začeli tukaj, in potem bomo nadaljevali pot po sobi
odgovarjanjem na vprašanja.
Kurt?
Kaj je prvi?
>> PUBLIKA: Ocean_array, nosilec, delfin.
Enako delfini, konzolo delfina?
Delfinov z kapitalske vse.
>> JASON Hirschhorna: OK.
Sprehodimo se skozi sintakso.
Tukaj, to je kot foreach zanke, tako da je dejansko delaš veliko
Stvari za nas.
In delfin je objekt.
Torej nam ni treba napisati nekaj kot so delfini, delfin, saj
delfin sama ugovarja, da želim.
To ni kazalo.
Ali to smiselno?
>> OBČINSTVO: Ja.
>> JASON Hirschhorna: Torej, kako si naredil predlaga spremembo kodo?
Če vemo, da smo glede na indeks?
>> Oh, oprostite.
Dober si.
Ampak kako -
Naj vprašam drugače vprašanje.
Če želimo -
kaj je dejansko napisati to.
Never mind.
Mi bomo to zapisali.
To je super.
Žal mi je.
Pravkar sem zelo zmedeno tam.
>> Pustimo, da za zdaj, in bomo prišli nazaj na trening delfina,
nastavitev delfina.
Reciva, najprej popraviti to risba ocean funkcija, in bomo prišli nazaj
da, Kurt.
Ampak, če je tako dober.
>> Oglejmo si notri draw_ocean.
Vrstica, ki izgleda, da je to napačno "shranjujejo slike delfinov v
ocean v HTML nizu. "In prav Zdaj sem tako kot todo, ampak jaz
res želite, da bi delfine Slike v oceanu.
Pa kaj, Noah, misliš, da je Prva stvar, ki sem morala storiti?
Če želim iti skozi celoten matrika, kaj je prva
kar sem morala storiti?
>> PUBLIKA: Moramo ustvariti zanko.
>> JASON Hirschhorna: zanko.
In kakšna naj bi ta zanko izgledal?
>> PUBLIKA: For -
moramo iti skozi vsako delfin v ocean array.
Torej za var delfina v -
Lahko napišete ocean niz?
>> JASON Hirschhorna: Tako?
>> PUBLIKA: Verjetno, da je prav.
>> JASON Hirschhorna: Ostaniva pri da za zdaj, in potem bomo
vrnil k njej.
In ti boš odgovoren za to linijo.
Tako da imam z zanko.
Michael, ti si zdaj.
Kaj naj storim sedaj?
>> PUBLIKA: Vi bi morali shranjevanje slik iz delfinov.
>> JASON Hirschhorna: Torej, če je to shranjeno?
>> PUBLIKA: V matriki delfinov?
>> JASON Hirschhorna: Zdaj sem zmeden Tudi o tem, kaj se dogaja.
Dajmo ugotoviti, kako lahko naredimo razhroščevanje to, in potem bom prišel
Nazaj k tebi, v redu?
Kaj je ekvivalent printf v JavaScript?
Annie?
>> PUBLIKA: To je dokument, ki pišejo?
>> JASON Hirschhorna: Ali kako lahko Nekaj ​​vidim v
potolažiti navzdol na dnu?
>> PUBLIKA: Console.log.
>> JASON Hirschhorna: Console.log, točno.
Torej, kaj je naredil console.log, in dajmo samo da "Dolphin" v, OK?
V idealnem primeru, če to deluje, si bomo imajo - pa poglejmo, nazaj v datoteko
dolphins.js je bilo šest delfini, Tako naj dobim šest ali kaj
upajmo, da natisne na konzola, kajne?
To je, če smo tako daleč zato, ker smo Kurt je naredil črto gor, potem pa
naredil Noah je za zanke, in imamo to linija, zato upajmo, da moramo videti šest
Stvari natisnjene na konzolo.
Torej, gremo tukaj, Odprimo naša potolažiti in osvežiti našo stran.
>> OK, tako da izgleda kot bomo videli šest indeksov.
Nič, ena, dva, tri, štiri, pet, ja.
>> PUBLIKA: Kako ste prišli do ta stran v vašem -
>> JASON Hirschhorna: kako pridem da te stvari tukaj?
>> PUBLIKA: Ne, Chrome stran v notranjosti [Neslišno] aparata.
Lahko vidimo, da ali ne?
>> JASON Hirschhorna: Ta Chrome stran tukaj?
>> OBČINSTVO: Ja.
>> JASON Hirschhorna: Torej, tako kot v P nizu osem, sem odprl okno, Chrome
na mojem namizju, na moji Macintosh namizje.
In če ste opazili, tu ta URL gor na zgoraj levo, ki se ujema ta IP
obravnavati tukaj.
Tako, da to stori, čeprav začetek problema določiti spec vas popelje
skozi točno, kako to storiti.
Vendar sem sledil to, in namesto tega skupaj s shuttle kodo, ravnokar sem
lastne kode.
>> Kul stvar je, da smo lahko tudi pregleda ocean_array.
Torej izgleda, da je ocean_array Niz šestih predmetov, in
odprimo vsako posebej.
Boom!
Ena.
>> Torej Kurt Izgleda, da si Koda delal odlično.
Vse začelo v ocean_array.
Ker sem misspoke prej.
Ampak ja, super posel.
Ocean_array je pravilna, in izgleda kot zdaj vidimo, da je delfin
število od 0 do 5, tako da je bilo videti kot indeksi v matriki.
Torej, glede na to znanje, Michael Kaj naj naredimo sedaj?
Pomislite na glas.
Kaj je nekaj, kar smo želeli storiti?
>> PUBLIKA: Želimo, da bi dobili JPEG za vsako delfin.
>> JASON Hirschhorna: OK.
Torej, kako lahko reference -
kako lahko dobimo JPEG?
Kje naj začnemo?
Kjer je vse shranjeno?
>> PUBLIKA: V ocean_array?
>> JASON Hirschhorna: OK.
>> PUBLIKA: Torej ocean_array, delfin -
>> JASON Hirschhorna: Kako delamo dobili nekaj notri -
tako da to nam daje ta cilj.
In smo videli že prej z struktur.
Torej, kakšen zapis rabimo za uporabo?
>> PUBLIKA: To bi bilo pika.
>> JASON Hirschhorna: pika.
In kaj potem polje?
>> PUBLIKA: Slika?
Ali da ni polje -
>> JASON Hirschhorna: Kaj je to imenovana v dolphins.js?
In glej, si lahko ogledate.
Mi lahko samo pojdi nazaj.
Vidimo lahko ocean_array, bomo lahko raziskati.
Kako se imenuje?
>> PUBLIKA: Vrsta.
Čakati.
Slike?
Rekel sem sliko.
>> JASON Hirschhorna: Picture.
Prav.
Nisi ne zveni kot veste, kaj si govoril, čeprav.
Zvenelo je bolj kot ugibanje.
Tako, da slika, da bi dal us URL slike.
Jeff, imate vprašanje?
>> OBČINSTVO: Ja, ne morem dobiti, kar imate na vašem brskalniku Chrome
Brskalnik na mojem računalniku.
Pravkar sem dobil "Neuhvaćen sklic napaka, konzola ni opredeljen. "
>> JASON Hirschhorna: Vi ste ustanovljen vse?
>> PUBLIKA: No, mislim, da sem storil vse, kar
si na velikem zaslonu.
>> JASON Hirschhorna: In ti chmodded vse datoteke?
In si šel skozi Celoten nastavitev?
>> PUBLIKA: Jaz bom poskusil znova.
>> JASON Hirschhorna: OK.
Preskočil sem nad tem veliko na začenja, vendar boste morali iti skozi
Celoten nastavitev tako kot pri Začetek problem določenem spec.
Chmod vse in poskrbite, da je noter
>> PUBLIKA: bom šel in podvojiti preverite.
Mislil sem, da sem to storil, vendar Jaz bom dvojno preveri.
>> JASON Hirschhorna: Torej, to izgleda tako kot so nas, da bom dal
Niz in sliko.
Super.
Imamo URL slike.
Kako bomo zdaj ga dal v -
kaj se zgodi, če smo napisali samo to, Michael?
>> PUBLIKA: Samo dobi sliko.
To pa je dejansko ni prikazal.
>> JASON Hirschhorna: Recimo glej kaj se zgodi.
Bomo prihranili da.
Mi jo bom tukaj.
Izgleda, da ne bomo dobili ničesar.
Če sem raziskati te tabele, zgleda notranjost -
Ja, izgleda, da ne bom dobil ničesar.
>> PUBLIKA: Ali moramo -
>> JASON Hirschhorna: To je niz, to kodo tukaj.
Kam bi rad dal to niz?
>> PUBLIKA: Želite ga v ocean?
>> JASON Hirschhorna: OK.
In tukaj bom dal niz imenuje html v ocean.
>> PUBLIKA: Torej bi bilo dolar znamenje, ocean, html [neslišno].
>> JASON Hirschhorna: To bi bilo Povedano naravnost tja.
Kaj pa, če želim, da ga dodate na -
Jaz sem že ustvarili niz, kajne?
Da bi v ocean, kar je ime te vrvice?
>> PUBLIKA: HTML.
>> JASON Hirschhorna: HTML.
Torej, kaj pišem naprej?
>> PUBLIKA: Enako, enako.
Ali samo enak?
>> JASON Hirschhorna: Kako bo zgodilo, če pišem enaka?
>> PUBLIKA: ne bo, da jo nastavite enako - ali ne bo to -
>> PUBLIKA: Dodeli?
>> JASON Hirschhorna: To bo dodelite, ampak kaj se bo zgodilo z vsem
, ki je shranjena v njej, preden?
>> PUBLIKA: To se bom znebil.
>> JASON Hirschhorna: To bo znebiti.
Torej, kako lahko dodate do konca?
Jaz bi samo kopirajte -
>> PUBLIKA: Plus enaka.
>> JASON Hirschhorna: Plus enako, kot nalašč.
Točno tako.
Torej, zdaj pa poglejmo, kaj to počne.
Boom!
Oh, moj bog.
To je samo veliko besedila.
OK.
>> Torej izgleda, da imamo veliko besedila, ampak to je super.
Vi ste naredili -
Vem, da je težko, to je novo.
Doslej tri od vaju naredili fantastično.
>> OK, ti si naslednji.
Kaj bi morali storiti?
Mi seveda ne želijo igrati le niz.
Ja?
>> PUBLIKA: Imam vprašanje.
Saj veš, ko boš ocean_array, delfin, v oklepajih, ni
delfinov kot asociativnega matrika v sebi?
>> JASON Hirschhorna: I misspoke.
Dolphin je indeks.
>> PUBLIKA: vendar ne var delfinov v ocean -
Mislim, ko ste jo na začetku naložijo dobro, var delfinov v delfini, ni
da delfinov je asociativno paleto?
>> JASON Hirschhorna: Ta delfin?
>> OBČINSTVO: Ja.
>> JASON Hirschhorna: Ne
Ta delfin je indeks.
>> PUBLIKA: OK.
Torej obstaja spremenljivka delfin?
Mislim, kot ključ delfinov v asociativno paleto?
>> JASON Hirschhorna: Tukaj?
Kot, dolphin.name?
>> OBČINSTVO: Ja, obstaja kot delfinov piko -
tako kot ni delfinov mišljeno da je vsak predmet?
>> OBČINSTVO: Ja, to je tisto, kar sem mislil, preveč.
>> PUBLIKA: Mislil sem, delfin je bil kot asociativno paleto v delfini.
Zato, ker je šest asociativna nizi v DELFINI, kajne?
>> JASON Hirschhorna: Right.
Tako smo to napisal Zdaj, to ni.
>> PUBLIKA: Zakaj je to?
>> JASON Hirschhorna: To bi lahko storila, in tam je pravzaprav funkcija jQuery
klical. vsak, ki daje si vsaka stvar.
Toda ta sintaksa ni -
Jaz misspoke prej - to sintakso ni, da je indeks.
To je samo, da nam indeksov.
Vendar pa bi lahko naredil znak za dolar. Vsak, ki je funkcija jQuery.
Da bi vam vsak sodelavec niz.
Zato preverite to.
Ampak to je, kaj vse to kodo ne.
>> PUBLIKA: Torej, ta prvi za zanko, bom Predvidevam, da bi Ponovil šestkrat
ker imate šest indeksov.
In potem druga za zanke, se ne da ponavljanjem
Ista količina časih?
>> JASON Hirschhorna: Ja.
>> PUBLIKA: Torej je res ni - smo Lahko bi napisal prvo zanko
še enkrat, in to bi delal.
Kot, var delfinov v DELFINI?
>> JASON Hirschhorna: Da, vendar smo Zdaj uporabo ocean_array.
Smo se preselili vse v ocean_array, saj pravijo, da kdaj želeli
spremeniti, kaj je v dolphins.js, ali če želimo manipulirati ocean_array
kasneje, ne želimo manipulirati delfini, spremenljiva.
Želimo, da manipulira s kopijo, ker če želimo, da bi nekaj
ven, na ta način, da smo pravkar bo varna.
Ali je to smiselno.
>> OBČINSTVO: Ja.
>> JASON Hirschhorna: OK.
Torej, Carlos, kako naj bi ta niz in da bo slika, namesto, in dobili
dejanska podoba?
Vi ste videli to kodo prej.
Kako naj naredim vključitev slike na strani?
>> PUBLIKA: Je to stvar, ki smo se o da HTML plus enaka te klice pomišljaj
širina, ona ga izbrisali?
>> JASON Hirschhorna: Ta stvari tukaj?
>> OBČINSTVO: Ja.
Vrsta.
>> JASON Hirschhorna: ne skrbi.
Ki šele začne HTML niz.
Če želim vključiti sliko v moji HTML spletna stran, tag, kaj moram uporabiti?
>> PUBLIKA: Ne spomnim se.
>> JASON Hirschhorna: OK.
Avie, mu pomagam?
>> PUBLIKA: Bi bilo sidro, href, nato pa ga povezati?
>> JASON Hirschhorna: Tako kot v Sidro.
>> PUBLIKA: Saj ni treba, da jo povezati, kajne?
>> JASON Hirschhorna: Kaj pa, če sem želeli ustvariti sliko?
>> PUBLIKA: To bi bilo img, nato pa src je enaka ne glede na niz?
>> JASON Hirschhorna: OK, tako da je prav, img.
Carlos, boste prevzel od tukaj.
img je kratica za "sliko" in src stojala za "vir". in boste morali, da ga
URL ali nekaj -
Niti URL.
Nekateri mesto, kjer da slika shranjena.
Tako da vem, da se bo dobil me slika, tako da zdaj kako je to dal vse
skupaj, mislil?
Imam nekaj sintakse moram popraviti.
Kaj točno moram s tipom, Carlos?
>> PUBLIKA: Ne razumem, kaj skušaš narediti.
Torej ste poskušali dati vse slike v tabelo?
>> JASON Hirschhorna: Želimo prikazati Vse slike na strani.
In videli smo, kako to vrstico kode desno Tukaj dodajajo nizov na naši HTML niz
in jih natisne takole.
Mi namesto želite prikazati slike.
In smo ugotovili, Maru, nam je povedal, da ta vrstica kode -
tako da je videti tukaj.
Če bomo šli, in raziskati, se bomo Uredite to kot HTML.
Maru, je dejal, če bomo to vrsto sintakse, smo dobili sliko.
Da ne bi bilo smiselno?
>> To je vrsta niz, ki smo res želim postaviti v notranjosti oceana
potop, ne le samo besedilo.
>> PUBLIKA: [neslišno]
>> JASON Hirschhorna: Oprostite?
>> PUBLIKA: Ne moreš kopirati da je eden, ki je Kianna,
in ga v to -
>> JASON Hirschhorna: Kopirajte to, in dal to tukaj?
>> OBČINSTVO: Ja.
>> JASON Hirschhorna: To je blizu, vendar tam je en problem s tem, in
kaj je to?
HTML je niz, moramo dodati nizov nanj.
>> PUBLIKA: Torej ste jo dali - nah.
>> JASON Hirschhorna: In imamo tri - to tukaj ni niz.
Kako bi bilo niz?
Kako ste vedno Nekaj ​​niz?
>> PUBLIKA: Ne vem.
>> JASON Hirschhorna: Če imam besedilo, kako bi bilo niz?
Všeč tukaj na tej liniji tukaj?
>> PUBLIKA: Daj na mizo?
>> JASON Hirschhorna: Kaj pa je to?
>> PUBLIKA: Citat.
>> JASON Hirschhorna: Double citati, kajne?
Dvojne kotacije naredi nekaj niz.
Tako, da omogoča, da niz, in to je niz.
Kako sem dal dva niza skupaj v JavaScript?
>> PUBLIKA: Dot.
>> JASON Hirschhorna: Ni dot.
To je PHP.
>> PUBLIKA: Plus.
>> JASON Hirschhorna: Plus, ravno prav.
Torej plus, nato pa kaj počnete Predlagam, jaz sem?
>> PUBLIKA: Še en citat.
>> JASON Hirschhorna: Še en citat, OK.
Kako končati niz?
>> PUBLIKA: Še en citat.
>> JASON Hirschhorna: Še en citat.
In kako naj to niz skupaj z vrvi?
Plus.
Točno tako.
Pravkar si to naredil za nas.
To je kot nalašč.
>> Torej, zdaj pa postane to.
In poglej, imamo celoto kup slik.
Oh, moj bog.
Tisti, ki so strašljivo.
Bomo raziskati jim v sekundi.
Ja, Noah?
>> PUBLIKA: Vem, da v resnici ne važno, ampak bi zapreš
Elementi z oznako slike?
>> JASON Hirschhorna: Mi lahko, če smo želeli, zaprite našo podobo
tag kar tako.
Oglejmo render to.
No, no, ne moremo storiti.
>> PUBLIKA: Oh, sem ga zlomil.
>> JASON Hirschhorna: Mislim, da je to je validacija, čeprav.
Mislim, da ne boste potrebovali zapiranje poševnica.
OK, to je super.
Carlos, hvala.
Doslej štirje od vaju so naredili super delo.
>> Seveda, kot vidite, smo ustvarja neke vrste tabele poševnega reza.
In hočem te stvari da so v tabeli.
Torej, kako sem dal ti stvari na mizo?
Jaz očitno potrebujemo nekaj več HTML.
Assam, kakšen HTML sem spregledal?
>> PUBLIKA: Kaj storiti želite storiti, je žal?
>> JASON Hirschhorna: Želim, da bi vse te podobe v tabeli, tako da ima vsaka slika
mora biti v eni koloni tabele.
Kako naj rečem, je to en stolpec?
Videli ste to kodo prej.
To je v P določi sedem.
>> PUBLIKA: Spomnim se enega je tr?
>> JASON Hirschhorna: TR je na vrsti.
>> PUBLIKA: jaz ne vem, off moje srce, ampak jaz bi preveriti.
>> JASON Hirschhorna: Ali nekdo se spomniš?
>> PUBLIKA: td?
>> JASON Hirschhorna: td, ravno prav. TD postavlja kot stolpec.
Torej, če sem dal TD tam, Assam, kaj moram dal?
Kaj še moram dodati?
>> PUBLIKA: Moraš zapreti?
>> JASON Hirschhorna: Točno tako.
Če pa to gre?
>> PUBLIKA: Točno tam?
>> JASON Hirschhorna: Tukaj?
>> PUBLIKA: Mislim, da ja.
>> JASON Hirschhorna: Kaj je to zapiranje tukaj?
Kaj je to?
To modra stvar?
>> PUBLIKA: To je za sliko.
Morala bi iti po, mislim.
>> JASON Hirschhorna: OK, ravno prav.
Pa poglejmo, kaj je to storil.
Oh, to je nerodno.
Odprimo oceanu, mizo, miza telo, tr.
Torej imamo tone, vendar sem Ne vidim slike.
To je čudno.
Izgleda, da ga je zgradilo, vendar pa mi ni pokazal slike.
Vse ideje, zakaj, da se lahko zgodi?
Vsak misli?
>> PUBLIKA: Če se pomaknete dol, boste videli.
>> JASON Hirschhorna: bum!
Torej, oni so tam, ampak to je čudno, da oni pa vse tja dol.
>> PUBLIKA: Oni so tudi vsi po vrsti.
>> JASON Hirschhorna: In oni so vsi v vrstico, in oni so vse različne velikosti.
Torej Assam, daj mi še eno vrstico kode če bom lahko vse slike
enake velikosti, in izgleda, da sem je bilo že navedeno velikost I
želijo, da bi bili.
Kako lahko naredim, da vsako sliko enake velikosti?
Daj ugibati.
>> Kaj pa te vrstice kode?
>> PUBLIKA: Lahko bi Tako kot konstantna?
>> JASON Hirschhorna: Ali pa, če je druga Tam, kjer sem lahko dal to vrstico kode,
če sem jo razumel?
>> PUBLIKA: Vse pot navzdol na isti liniji?
>> JASON Hirschhorna: OK, kaj je dal je tukaj, ravno prav.
In zdaj poglejmo, kaj se zgodi.
Oh, moj bog!
Zdaj je videti, kot da smo že kaj nekaj, in je videti, kot da
vse vrste prilegajo v tabeli, ki smo zgrajeni v vsaki td.
>> Prav tako, Assam, recimo, mi je všeč njihova Višine bi biti malo bolj -
Višine stvar me vrže dol, tako kaj moram nastaviti na njihovo višino?
Izberemo poljubno število.
>> PUBLIKA: 200?
>> JASON Hirschhorna: 200.
Jaz bom izbral 100.
To je super.
Za res všeč 200.
Takole!
OK, zdaj je to začeli gledati malo bolje in malo bolj organizirano.
>> Kakršne koli druge misli za tisto, kar moramo storiti za shranjevanje slik delfinov?
Ja?
>> PUBLIKA: Ali so citati ali samski citati, okoli vrednosti, za
vir, višina, širina, so tiste neobvezno?
>> JASON Hirschhorna: Kje so enojnih narekovajih?
>> Skupina: Kot v nekaterih primerih, bi si moral kot višino
enak quote "150". Je da niso potrebne.
>> JASON Hirschhorna: Torej dajmo poglej tukaj.
Če kliknemo na morje, pojdi v tabeli, boste opazili, tukaj ga dejansko
prištejejo ponudbe za mano.
>> PUBLIKA: OK.
>> JASON Hirschhorna: In tako sem spoznala, kaj delamo zdi boleče počasen.
Napisali smo samo tri vrstice kode Doslej ali štiri vrstice kode, ampak
To je v bistvu postopek, ki Sem šel skozi vsak čas želim
da bi te spletne strani.
Po vrsticah, z uporabo konzole navzdol tukaj, raziskuje stvari in kipec
out korak-po-korak, kaj želim storiti.
Torej, upajmo, to posnema za vaju v dobrem, pedagoški način, kar ste
bo dejansko delal, ko ustvarite svojo spletno stran.
>> Gremo naprej.
Ustvarili smo te stvari.
Bom dejansko -
Avie, imam pomembno vprašanje za vas.
Ne vem, bomo naprej.
Greva na "železniške delfinov, ko njegov slika kliknili. "Kako ti
Predlagamo pišem to vrstico kode?
>> PUBLIKA: Obstaja funkcija imenovano "vlak".
>> JASON Hirschhorna: Tam je funkcija imenovano "vlak", ravno prav.
>> PUBLIKA: Pričakuje, da bo indeks.
>> JASON Hirschhorna: Vlak pričakuje indeks je tako, OK.
Avie, to je točno obrazložitev da rada vidim.
Vlak pričakuje indeks.
>> PUBLIKA: Torej boš da imajo zanko.
>> JASON Hirschhorna: No, želim narediti ko je slika kliknili, tako Avie,
kako spremljati, ko Slika je kliknil?
Obstaja nekaj načinov za to.
To je moč JavaScript in jQuery, ampak tudi najtežji del.
>> PUBLIKA: Če oklepaj, ne.
Ali pa, če oklepaj dogodek, ali kaj relativno enostavna?
>> JASON Hirschhorna: Tako smo videli nekaj načinov, da to storite v predavanju.
Ena stvar je, da, tukaj, lahko narediti nekaj podobnega bi lahko ustvarili
funkcije, kot so na klik, ali pa nekaj podobnega na klik.
Vsi spomnite videnje nekaj takega?
Vam je v notranjosti HTML tag.
Vidim nekaj praznih obrazov.
Nekateri ljudje so, kot so, kaj se govori?
>> To je v redu, ker mislim, da je bolj zapleten način, da to storite.
Bomo storili veliko lažje način s pomočjo jQuery.
Torej, Avie?
>> PUBLIKA: Hm?
>> JASON Hirschhorna: Če želim narediti Nekaj ​​jQuery, sem seveda začetek,
kot prej, s to znak za dolar, odprt paren, v bližini paren in dvojna
citira tukaj.
Zdaj vemo, da rabim izbirnik tukaj.
Kaj selektor vam predlagam, bi se uporabljala za vsako posamezno sliko ali vsak
single slika?
>> PUBLIKA: Image?
>> JASON Hirschhorna: To je Točno tako.
, Ki se bo uporabljala za vsako posamezno sliko.
Dobi vse.
To ni ID, to ni razred, je Vrsta oznako, in to bo
dobili vsak enega.
>> In zdaj bom povedal to za zdaj, in si lahko ogledate do več
dokumentacijo o kasneje, vendar to stvar, ki se imenuje "on" se ukvarja z dogodki.
Torej, kaj boste dobili storiti zdaj, in ki je super močna, je reči, katera vrsta
dogodek, ki ga iščete in kaj želite storiti, ko
prejeli ta dogodek.
Tako da bom dal malo malo več kode, Avie, nato
moraš iti, v redu?
>> PUBLIKA: OK.
>> PUBLIKA: Po - bomo rekli "Klik" v tem primeru, ki ga bom
splošno uporabo.
Torej na klik, nato pa bomo to opraviti anonimno funkcijo.
In ta sintaksa boste videli veliko, in upajmo, da bo
se pisanja veliko.
Kaj to pa je spet na klik v nekaj, kar ti sliko, karkoli,
kaj se imenuje slika, se bomo zagnati to anonimno funkcijo.
>> Nisem ji dala ime.
Nisem ji posreduje nobenih argumentov.
Jaz sem samo, kot je, ustvarjanje tukaj deluje, in tukaj je, kaj koda
boš naredil.
Da je s to sintakso sredstvi.
In prav tako, kot boste opazili, je videti zelo podoben temu tukaj, da smo
napisal prej.
>> OK, Avie.
Torej hočeš, da pokličem vlak na indeks.
Je to tisto, kar želite narediti?
>> PUBLIKA: Da.
>> JASON Hirschhorna: To je to?
OK.
Poglejmo, kaj se zgodi.
>> PUBLIKA: Počakajte, čeprav.
Indeks ni spremenljivka zdaj.
>> JASON Hirschhorna: Torej indeks ni spremenljivka zdaj.
Ne vem, kje ste jo dobili od.
>> PUBLIKA: [neslišno].
Tako da boste morali najprej ugotoviti, delfin, ki je dobil kliknili?
>> JASON Hirschhorna: Odlično.
Boste morali ugotoviti, kateri delfin dobil kliknili.
To je divji strel v temi.
Ima kdo kakšno idejo, kako lahko ugotovimo kaj delfin dobil kliknili?
Če ne, bom samo dal, ker je to precej noro.
OK.
Torej, kaj je izpisal preko console.log.
>> Ta stvar.
Torej, znak za dolar, odprta paren, Tako blizu paren.
Torej, ko sem kliknite na to sliko, bom to natisniti na konzolo,
in da vidimo, kaj se zgodi.
Pojdimo nazaj.
Pojdimo potolažiti.
Brez napak, hvala bogu.
>> OK.
Sem kliknil.
Naj še enkrat narediti.
Sem kliknil to prvo sliko, in to dobil natisnjene na konzolo,
ta linija stvari.
Grem, da uporabljate Beseda "to" veliko.
Ta stvar tukaj, to je zelo posebnega, in to počne točno, kaj
Avie želi to storiti.
To je vse, kar je bilo kliknili ali karkoli.
Ker še enkrat, to se zgodi, selektor da se ukvarjajo z veliko stvarmi, ne bomo
nujno vedeti, katera stvar, ki smo govoriš, zato smo želeli ugotoviti
, katero stvar, govorimo o preko te skladnje.
V tem primeru tukaj, hashtag ocean, smo vedno vedeli, kaj stvar, ki smo
bodo govorili o tako ne bomo nikoli res potrebno to
znotraj hashtag ocean.
Vedno je ocean, ki div.
To je ID, edina možna stvar.
>> Vendar pa v tem primeru, to velja za veliko podob, v resnici, šest slik,
in tako smo želeli vedeti, kaj zlasti Slika je bila kliknili.
In izgleda, da je to vrsto informacij, ki jih dobijo.
Smo dobili zgleda nekaj velikega Niz, in smo dobili vse to
Podatki s tem.
Smo dobili tone in tone in ton stvari.
jQuery je zelo močna.
To nam je kar tono informacij O tem HTML elementa.
Avie, kaj želimo vedeti O tem element HTML?
>> PUBLIKA: Nekaj ​​podobnega kot ID.
>> JASON Hirschhorna: ID.
No, imamo vir, širino in višino.
>> PUBLIKA: Mi lahko uporabite vir.
>> JASON Hirschhorna: Mi Lahko uporabite vir.
To nam bo dal niz, URL niz.
Kaj bomo naredili s da ko bomo imeli to?
Kako bomo prišli nazaj do naše indeks ocean_array?
>> PUBLIKA: Mi lahko primerjajo je na drugi strani.
>> JASON Hirschhorna: Tako smo lahko zanka skozi vsako.
Zdaj smo spet lahko zanko in nato primerjati to.
Predstavljajte si, kaj bi bilo enostavnejši način, če bi lahko samo predstavljate eno?
>> PUBLIKA: Ne da bi zanko.
>> JASON Hirschhorna: Ne da bi zanko.
>> PUBLIKA: Just ugotoviti delfin, [neslišno].
>> JASON Hirschhorna: Kipec kaj delfin.
OK.
Torej, kaj je rešitev te informacije V tem oznako slike.
In še enkrat, prav zdaj, del te stvari preprosto čarobna, ker sem morda
se vam bo pokazal to prvič, vendar upam, da so to stvari,
boste, da se delaš.
Torej je to nekaj čarobno ne moreš storiti.
Lahko prihranite nekaj dodatnega metapodatke v elementu.
To ne bo prikazal, da ne bo vpliva na karkoli.
Lahko samo shranite tam.
In jaz predlagam, varčujemo Indeks z vsako sliko.
>> Tako kot ti, da si ustvarijo atribut imenovan podatki dash, in
potem ne glede na ime te bi jo dal.
Podatki armaturna je posebna stvar, ki je dana za vas, in pravi, da je to
Nekaj ​​uporabnikov se bo vzpostavila.
Tako ustvarjamo to stvar, imenovano indeks, ta ključ se imenuje indeks.
>> In znotraj njega, bomo dal Ne le eden vsakič, ampak kaj storiti
smo se v njem, Avie?
Kaj se dogaja tukaj?
>> PUBLIKA: Dolphin.
>> JASON Hirschhorna: Dolphin.
To ni ta beseda.
Delfin.
In spet smo že natisnjene delfina prej, da 0, 1, 2, 3, 4, 5, in
smo varčevanje, ki s sliko.
>> Torej, zdaj, če jaz - in spet, varčujemo, da so metapodatki.
Kako lahko dostopate, da metapodatki?
To je s funkcijo le, imenovano "podatki". In boste morali to opraviti enega
in samo en argument, ki je ime stvar.
Torej bom to natisniti, in potem bom vzel vprašanja.
Ampak mi v bistvu pravim dal to Objekt, ki je bil kliknili na, poglej
v vseh svojih lastnosti podatkovnih in ena imenovana "indeksirajo,"
daj mi te vrednosti.
>> In da vidimo, kaj se zgodi, ko smo osvežite to stran.
Točno to, kar smo pričakovali.
Še enkrat, da je bilo precej čarobno.
Pravkar smo naredili veliko tam.
Kdo ima kakršna koli vprašanja o tem?
Ja?
>> PUBLIKA: Imam vprašanje O live kodo.
Uporabite kot enojni narekovaj, dvojni citiram, kot prav tam.
>> JASON Hirschhorna: Tukaj.
>> OBČINSTVO: Ja.
Ali obstaja razlog, zakaj ste storili enojni narekovaj, dvojni narekovaj?
>> JASON Hirschhorna: Obstaja razlog, in to gre nazaj na tisto, kar Marcus
prej vprašal.
V skladu s tem sem bil malo bolje v moji kodiranje.
To hočem, in to je tisto, kar sem pošteno bi bilo treba storiti vse
čas, za širino in višino zlasti.
Oglejmo si tukaj.
Boste videli tukaj, Lahko si videl to?
Vem, da je nekako majhen, vendar podatki Indeks dash je v dvojnih narekovajih.
Te stvari vedno potrebujejo biti v dvojnih narekovajih.
Vrednost vedno potrebno biti v dvojnih narekovajih.
>> Ampak tukaj, če bom naredil dvojni narekovaj, da bi na koncu tega niza tukaj,
in zdaj jaz ne bi bil tipkanje v nizu.
Tako sem dobil okoli, da jih samo z uporabo enojni narekovaj, ker enojni narekovaj
ne konča niz JavaScript, toda v HTML ne skrbi, če ste
ji daje enojne narekovaje ali dvojne narekovaje.
To bo samo razlaga kot dvojne narekovaje.
Ali to smiselno?
Ja?
>> PUBLIKA: Kako dobiš, da IP naslov na dnu vaše stranke?
Moj pravi, da ni IP naslov.
Ali obstaja nekaj, kar bi morala naredili v [neslišno].
>> JASON Hirschhorna: V vaši napravi, to nima nič?
>> PUBLIKA: Da.
>> JASON Hirschhorna: Nekaj ​​je lahko storite, da to popravimo, vendar nisem
dogaja, da preživijo čas hoje skozi to prav zdaj.
Vendar pa lahko to storite po oddelku.
>> PUBLIKA: Če greš nazaj konzola, zakaj je
Številka na seznamu 012.321?
>> JASON Hirschhorna: konzola?
Oh, saj sem bil tako, da kliknete okoli divje.
>> PUBLIKA: Oh, OK.
Never mind.
>> JASON Hirschhorna: In spet sem lahko kliknete o nečem a bajillion krat.
>> PUBLIKA: Imam vprašanje o tvoja zanka spet vaš for zanke.
Saj veš, v P nastavite osem, ki jih uporabiti drugačno obliko te zanke.
Tako da jim kot var i je enak 0, i manj kot, ocean_array.length, i + +.
So tisti, ki enakovredno?
>> JASON Hirschhorna: To je standard za zanko.
Ali pa ja, to je za zanke.
V bistvu, smo videli, da je enakovreden.
>> PUBLIKA: Tako da je enakovreden s tem, kar si storil tukaj?
Je tista, bolje kot drugi?
>> JASON Hirschhorna: Ne
>> Torej, še enkrat smo šli pri nekaterih stvareh.
Mi smo zdaj preselili naše cone udobja in začeli delati nekaj res kul
Stvari, ki smo ga ni nujno izginili v razred prej bo vendar
upajmo, da bo zelo močna za vas, ko kodiranje.
>> Avie, greva nazaj gor.
Imam indeks delfinov.
Zdaj, kaj moram storiti?
>> PUBLIKA: Moraš ga usposobiti.
Torej, namesto da console.log, vas lahko določena spremenljivka, ki je enak?
>> JASON Hirschhorna: OK.
Torej?
>> PUBLIKA: Nisem prepričan če lahko to storite.
>> JASON Hirschhorna: Torej var x enak to, karkoli že to vrne,
se bom vrnil.
Ni važno.
To se lahko vrne nobene spremenljivke.
Tukaj ni tipi tukaj.
>> PUBLIKA: Ali si lahko samo narediti klic funkcije.
>> JASON Hirschhorna: Ja, zakaj ne bi jaz naredil?
Samo naredi klic funkcije.
>> OBČINSTVO: Ja.
Povedano drugače niz oklepaju.
>> JASON Hirschhorna: popolna.
Točno tako.
Tako da bo poklical funkcijo vlaka.
Seveda ni nič na vlaku funkcija, zato predlagam, Akshar, kaj sem
bi morala storiti v funkciji vlaka.
Dajte mi nekaj psevdo kodo.
>> PUBLIKA: Mislim, da bi morali odstraniti delfina iz prvotne tabele.
>> JASON Hirschhorna: In to je vse Noetu prej, zakaj smo kopirati
je v novo paleto.
Seveda, ker ne bomo urediti naše delfini matrika, ker kaj, če druga
Program je njeno uporabo, ali kaj, če želimo dostop je nekje drugje?
Mi želimo, da bi kopijo, in to je eni bomo urediti.
>> PUBLIKA: Potem lahko postavite je v svoji novi lokaciji.
>> JASON Hirschhorna: In kaj storiti moramo storiti po tem?
>> PUBLIKA: In potem si natisnete informacije o delfinu.
>> JASON Hirschhorna: To je Točno tako.
Mi ga odstranite iz ocean_array smo ga v bazenu, nato pa črpamo
ocean v bazenu.
Kako odstraniti delfin iz ocean_array?
>> PUBLIKA: Greš v indeksu.
Oh, OK.
Uporabite funkcijo spoja.
>> JASON Hirschhorna: OK, torej, da je prav.
Lahko uporabite funkcijo spoja, ki traja nekaj ven iz matrike in
kondenzira.
To je nekaj novega smo ni videl.
Vendar sem dejansko želijo ohraniti prostor tam zato, ker želim, da natisnete
Prazen prostor v ocean.
>> PUBLIKA: Torej lahko nastavite sliko tega indeksa, ocean_array
Indeks dot slike.
>> JASON Hirschhorna: OK, ocean_array, indeks.
>> PUBLIKA: Dot sliko.
>> JASON Hirschhorna: Dot sliko.
>> PUBLIKA: In ti jo nastavite na nič?
>> JASON Hirschhorna: Enako null.
OK.
Torej, nič ni tam, tako da potem Kako sem dal v bazenu?
Constantine, kako sem ga v bazenu?
Imamo to spremenljivko smo poklicali, imenovano bazen, tukaj.
>> PUBLIKA: Ali pač enaka ocean_array indeks?
>> PUBLIKA: ne Če boste preklopite vrstni red?
>> JASON Hirschhorna: Samo trenutek.
Ja?
>> OBČINSTVO: Ja, to je bilo pravzaprav dobro izhodišče.
>> JASON Hirschhorna: Kaj se tu gre?
>> PUBLIKA: Ali je indeks?
>> JASON Hirschhorna: Indeks, točno.
In kaj si rekla, Constantine, je nekaj, kar bi morali storiti?
>> PUBLIKA: Morali bi morda preklopite vrstni red.
>> JASON Hirschhorna: In zakaj naj bi zamenjamo vrstni red, morda?
>> PUBLIKA: Ker si to poudariti, da je že null.
>> JASON Hirschhorna: Torej, to ni vse, null, vendar smo izgubili URL slike.
Smo ga izgubili za vedno?
>> PUBLIKA: tehnično ne?
>> JASON Hirschhorna: Have smo ga izgubili za vedno?
>> PUBLIKA: Ne
>> JASON Hirschhorna: No, kje je?
>> PUBLIKA: V izvirni delfin -
>> JASON Hirschhorna: To je v delfini, ampak v ocean_array
smo ga izgubili za vedno.
Torej Constantine, lahko predlaga boljši način za pisanje te vrstice?
Pravzaprav mi je žal, je shranjena v bazenu.
Jo imamo v bazenu, saj Bazen je predmet, kajne?
Ocean_array indeks, ocean_array je niz predmetov.
>> Torej, bazen je objekt, in imamo URL tam, in navzdol
Tukaj je nastavljena na null.
Torej pravzaprav nismo je za vedno izgubljena.
To je samo shranjeni v bazenu.
Vsekakor pa to ni v ocean_array, in kot si rekel, Carlos, je v
delfini niz.
>> Torej, to zgleda lepo.
In potem kako pripraviti ocean in bazen?
Mario?
>> PUBLIKA: Lahko samo pokličete draw_pool in draw_ocean?
Naprimer, draw_pool, in nato -
No, ja, da ne bo nič.
>> JASON Hirschhorna: Great.
Kaj se draw_pool storili?
>> PUBLIKA: Narišite bazen?
>> JASON Hirschhorna: Ja, no, kaj bo naredil?
>> PUBLIKA: Žal mi je.
Lahko bi naredil enako stvar, tako kot imajo -
>> JASON Hirschhorna: Drži, bomo do tja.
Nič.
To počne nič prav zdaj.
Poglejmo, če to deluje, čeprav.
Kdo nam je dal to kodo?
Akshar in Constantine nam je dal to kodo?
OK, pa poglejmo, kaj se zgodi.
>> Ah!
To je bilo tako razburljivo.
Izginil je.
Oh, fant.
To je nekako grd.
No, lahko gremo nazaj in določi kasneje.
Sprašujem se, kje je?
Shranili smo v tem bazenu spremenljivko.
Kako ugotoviti, če je to v tem bazenu spremenljivko?
No, še enkrat, moč JavaScript, in predvsem orodja, ki
Chrome vam, se lahko zdaj pregledati, da se bazen spremenljivko.
To je globalna, se spomniš?
Mi ni dal var ključno besedo.
Torej, če sem tip Vnesite tukaj, Constantine, kaj misliš, da sem
bo dobil, ko sem pritisnite tipko Enter?
>> PUBLIKA: Ne vem.
>> JASON Hirschhorna: Ugani.
>> PUBLIKA: Nič?
>> JASON Hirschhorna: Nič narobe.
To je bil dober guess, čeprav.
Imam predmet.
Spomnim se, da si mi dal da vrstica kode.
Bazen, rešil s tem, da spremenljivka objekt.
In res, bomo videli predmet ste shranili v njej.
To je noro.
Mi lahko pregledajo od tukaj.
To je skoraj tako kot v realnem času GDB, da lahko pogledamo skozi našo kodo in
ugotovimo stvari ven.
To je super kul in super močan.
>> OK, dajmo končati to gor.
Narišimo bazen v petih minutah.
Maru, daj mi linijo koda za pripravo bazen.
>> PUBLIKA: Lahko bi imeli še en spremenljivka HTML, temveč / for.
>> JASON Hirschhorna: Naredimo je zelo enostavna za zdaj.
Reciva natisniti ime delfin urimo.
>> PUBLIKA: In potem lahko narediš dolar podpisati, odprti oklepaji,
in potem open quote.
Mislim funtov bazen, če da je bila stvar.
Ne spomnim se.
>> JASON Hirschhorna: Poglejmo nazaj.
Mislim, da je stvar.
>> PUBLIKA: OK, ja.
In zaprite quote, v bližini oklepaje . Html, odprti oklepaji,
in potem mislim, bazen, kot oklepaj 0 ali nekaj takega.
Zapri ime pika.
Ne vem, če to deluje.
>> PUBLIKA: OK, pa poglejmo, kaj se zgodi.
"Ne morem brati imena lastnine nedefinirano. "Torej še enkrat, tukaj je, kaj
gremo preverit.
Bomo raziskati.
Ste naredili bazen, odprt bracket0. Ime.
Še enkrat, to počnem ves čas, in jaz sem zmedeni, kaj se dogaja, kaj počne
To opozorilo pomeni.
Oglejmo si bazen.
Oglejmo si bazen konzole 0, neopredeljene.
Torej, to je, če smo tek v naš problem, kajne?
Bazen bracket 0 ne, Očitno je, da obstajajo.
Kaj misliš, da ne obstajajo?
>> PUBLIKA: Je bazen le objekt sam po sebi?
>> JASON Hirschhorna: No, kaj piše tukaj?
Ko smo zadeti nastopiti na bazenu, kaj pravi, da je?
>> PUBLIKA: Predmet.
>> JASON Hirschhorna: To je objekt, tako?
>> PUBLIKA: Oh, ja.
Torej samo pool.name namesto -
>> JASON Hirschhorna: Pool.name daje točno to, kar si hotel.
In se zavedam, da bom skozi to počasi in belaboring to točko, vendar
to je točno, kako sem naredil te stvari.
Boste zašli v teh hroščev V času vašega končni projekt, zato upam,
to pooblašča, da lahko uporabiti vsa razpoložljiva orodja.
Te so ključnega pomena in bo dobiš super Prevarant daleč.
>> Torej, ne želim, da samo izpiše ime.
Naj se malo malo lepše, kot je ta.
>> PUBLIKA: Kaj še želite narediti?
>> JASON Hirschhorna: OK, v redu.
To bomo storili samo to.
Ugh.
Fantje, nimate življenja.
>> OK, bum, razumem.
Izgleda dobro.
Videli boste, Akshar, tu spodaj, smo null, ni mogoče najti.
Torej izgleda, da je še vedno poskuša našli nekaj podobo, in da ni storil
točno to, kar smo želeli storiti.
Ne bomo šli v to, toda tam je verjetno čistejši način
to.
>> PUBLIKA: Lahko odideš kot Prazen prostor za sliko?
Všeč mi je, namesto da jo nastavite na ničlo, lahko nastavite, da se rad prazno
niz ali kaj?
>> JASON Hirschhorna: Tako?
>> OBČINSTVO: Ja.
>> JASON Hirschhorna: [neslišno].
Ni mogoče najti.
Torej obstaja boljši način za to početje.
Jaz bi predlagal to.
Samo nastavitev null tam.
Potem seveda, kaj je se bo zgodilo?
To se dogaja, da gredo stran v celoti.
Torej, če smo želeli ohraniti prostor in naredite da bomo verjetno želeli narediti nekaj
navzgor tudi tukaj.
Grem, da se boste začeli.
Akshar, daj mi to vrstico kodne res hitro.
>> PUBLIKA: Če ocean_array, delfin, enako, enako, enako - enako null?
Ja.
>> JASON Hirschhorna: Kaj pa potem?
>> PUBLIKA: Potem pa HTML.
Pravkar ste kopirajte spodnjo kodo, res.
>> JASON Hirschhorna: Kopiraj, kaj?
>> PUBLIKA: Lahko kopirate -
>> JASON Hirschhorna: Ta?
>> OBČINSTVO: Ja.
>> JASON Hirschhorna: Vse?
Nimamo sliko.
>> PUBLIKA: ti pomeni Lahko pustite -
ja, lahko si ga zaprete.
Ampak mislim, da boste morali nastaviti širino.
>> JASON Hirschhorna: No, samo Ustvarite prazen stolpec.
OK.
In potem v tem primeru, bomo verjetno želite to narediti, kot dobro.
>> Ups.
Oh.
Ni deloval, vendar nismo dobili to napako.
Poglejmo, kaj se je zgodilo tukaj.
>> Torej ni nič tam, pa kaj si rekel, da bi morali dodati?
>> PUBLIKA: moramo določiti širina zapored.
>> JASON Hirschhorna: Za kaj?
>> PUBLIKA: Mislim, da je 150.
>> OBČINSTVO: Ja, to je 150.
>> JASON Hirschhorna: Bomo dal to sem voditi svojo kodo dosledni.
Ampak to ni ena.
OK, dobro.
Objavljeno.
OK?
Torej je še vedno tekoč stran.
>> PUBLIKA: Oh, pokličite širino?
>> JASON Hirschhorna: Zgleda kot je širina 150.
Pa poglejmo.
Zdaj bomo narediti končno, cool, močna stvar, ki sem
Vam bomo pokazali.
Da ne gremo do konca te kode, ampak na spletu, preden smo nehal, vse to
Koda bo pravilna.
Jaz ti bom email popravljeno različico z nekaterimi moji styling po
oddelek, in da se bo objavljen na spletu.
Spodbujam vas, da raziskovanje tega in to uporabi kot referenca, ampak jaz
bi ti rad pokazal končni orodje za to razred, in da je tukaj na
na desni strani.
In sva pogledala na tem zadnjem tednu, zdaj pa upajmo, da je malo bolj seznanjeni
za vas in udobno.
>> Lahko dinamično igrajo s CSS ene strani.
Smo se nam dejansko že videli dinamično igrati s HTML.
Spomnim se, da smo na desni kliknite Uredi kot HTML?
Tukaj?
Zato smo dinamično igral s HTML.
>> V konzolo, lahko dinamično igrajo z JavaScript ene strani.
Na primer, da je veljavna JavaScript linijo.
Boom, dobil sem točno to, kar sem si želel.
Tako smo lahko dinamično igrati z HTML, dinamično igrajo z
JavaScript.
Zdaj bomo dinamično igrajo s CSS.
>> In vse to zato, ker je kot instant, živi GDB povratne informacije, zato si
more vedeti, pravico, da se nekaj dogaja, preden iti svojo kodo, in lahko
Ne veš, kaj nekaj je bo izgledal.
Torej, to je super Prevarant kul.
>> In kaj je na koncu pogled na dinamično igranje z CSS.
To je tam na desni strani na desni strani, element.style.
Pojdiva s tem.
Tukaj je naš element.
Dajmo mu nekaj dodatnega CSS.
>> Ali mi je, lahko bi ji dati nekaj dodatnih CSS, toda verjetno, v tem primeru
želite spremeniti ta atribut.
Torej, gremo dol na tej progi.
Oh, ne morem narediti, da tukaj.
Žal mi je.
Uredite AS -
tako, da je, kako si lahko uredite CSS.
Ne bomo urediti CSS na to drugič, vendar ne želimo urediti
HTML in ji dati ekstra atribut.
Kaj ste predlaga spremembo to?
Mislil sem, da Avie imel predlog.
>> PUBLIKA: Col širina?
>> JASON Hirschhorna: To je izgledala da ni storil ničesar niti.
Poskusimo CSS.
>> PUBLIKA: [neslišno] razred?
>> JASON Hirschhorna: Piše to ne deluje.
Daje to rumeno stvar.
>> PUBLIKA: A [neslišno].
>> PUBLIKA: Ali nisi nastavitev širine podobe do 150, ko si to naredil?
Tako kot si ne bi samo uporabo širino?
>> JASON Hirschhorna: Ja.
>> PUBLIKA: Ampak nimamo slika več.
>> JASON Hirschhorna: Ne
Nimamo ničesar tam.
Torej ne bomo rešili Poseben problem.
Mi smo šli nazaj v Akshar je rešitev, ker želim, da nastavite
delfinov brezplačno za zdaj, ali da je zadnja
stvar, želim končati.
Torej bomo to pustil tukaj hkrati pa priznava, da ni čisto
pravilna, in gremo da pridejo nazaj na to.
>> Žal mi je.
Sem rekel, da bomo lahko dinamično spremenite CSS.
Oglejmo si, da in ne da res hitro.
Torej, če sem preglejte ta element tukaj, in reči, želim, da bi bilo modro,
lahko prideš tja, barva, saj Vem, da spremeni barvo
nekaj, in videli smo, kako se je spremenilo to modro.
Tako, da me je dinamično spreminjanje CSS.
Ali to ne spremeni za vedno, potem pa Ne morem iti nazaj v svojo CSS datoteko in
spremenite barvo predmeta.
>> OK.
To je bilo veliko.
Nismo končam neverjetno program.
Naj vam pokažejo, da resnično hitro, in potem bomo pa glavo ven.
Oh, kje je?
Ne!
Počakaj.
>> OK, tako kot si spakira, Predogled neverjetno, ali spredaj
poglejte, naslednje času.
To je Dolphin Trainer 2013 in to ne deluje.
Super.
>> [SMEH]
>> JASON Hirschhorna: Oh!
Boom!
Kaj to pomeni?
>> PUBLIKA: Niste chmod.
>> JASON Hirschhorna: Nisem ga chmod.
>> PUBLIKA: Vrstica eno.
>> JASON Hirschhorna: Oh, poglej to.
OK.
Torej, imam šest delfinov.
Kaj se zgodi?
Pa poglejmo.
Če treniram eno, zdaj usposabljanje Lili.
Oh, rad bi vas osvobodil, Lili.
Tam greš nazaj v ocean.
>> Tako da je bila ta teden.
Če imate kakršnakoli vprašanja, bomo zunaj.
In še enkrat, ti bom poslati Preostali del te kode.
Hvala vam, fantje.