ALLISON BUCHHOLTZ-о: Сите права секого. Добредојдовте назад на секција. Тоа е нашата претпоследниот дел. Тоа е толку тажна. Јас не знам што јас ќе одам да направите без да се види дека вие момци секој понеделник. Претпоставувам дека треба да just-- можеби и ние може само да сретнам и ќе имаме вечера или нешто слично. Не знам. Јас ќе донесе храна, наместо. Ние само ќе разговараме. Но да, следната недела ќе го биде нашата последна секција. На тој белешка, имате квиз следната недела. Знам дека сум заборавил да го дадам, како, две недели претходно известување минатата недела, но се надевам дека вие момци знаеше ова доаѓа. Се надевам дека ова е еден од последните midterms за вас момци за семестар. Но, тоа се случува да се покријат сите материјал што ние сме го завршена. Значи тоа не е како што само може да се заборави околу четири јамки или променливи. Затоа што сме научиле оние кои се во почетокот, тие се очигледно фер игра за вашиот квиз. 

Тоа се случува да биде ист формат, истиот должина, така што веќе се навикнати на тоа. Постојат ќе биде кодирање со рака проблеми, можеби и некои вистински лажни, можеби некој краток одговор. Значи, вие треба да бидат запознаени со формат, особено ако се земе на пракса тестови. Но, како што велат овде, тоа е кумулативни, но ние сме дефинитивно ќе треба да се фокусира на работите од шест наваму недела. Значи, ние сме веројатно нема да ве прашам за колку бајти се во секој вид или овие видови на нештата, но ние сме веројатно нема да биде заинтересирани за нешта како се поврзани листи, или различни структури на податоци, или различни алгоритми дека ние сме зборуваше. Така осигурајте се дека сте навистина врз оние, и ако потребни никакви ресурси, тука е многу ресурси. Јас само ви даде вид на брз листа таму. 

Следната недела ќе биде квиз се видат во ова време. Значи, ако имате било какви прашања или специфични теми, одредени работи за кои квиз што би сакале да поминат, ве молиме да ги испратите на мене пред време, така што можам вид подготви некои материјал за тоа. И покрај ова делот преглед, ние ќе исто така, да се држи курсот на ниво се видат како што правевме последен пат. И тоа се случува да биде направено од страна на истите луѓе. Јас не знам дали тоа прави подобро или полошо, но тоа се случува да ми биде, Хана, Davan и Габе повторно. Значи, ако сакате да се види сите нас шеги едни со други и ви прошетка низ квиз преглед, дефинитивно треба да дојде до следниот понеделник, исто така. Значи, вие само ќе треба понеделник џем спакувани на квизот преглед, кој е добар затоа што тогаш имате вторник да се процесира преку сè. 

Но, дефинитивно не се провери на овие ресурси. Study.csv.net е далеку, јас мислам, една од најпознатите корисни, најмногу поради тоа што има многу примерок код, таа ги има сите штекерите со сите белешки на тоа, кои се навистина она што го привлече повеќето на мојот дел од материјали. Ако има нешто во претходната делови кои можеби сум испрати дека не може да има добиле, само да ме известите. Како и минатата недела примерок код, ако некој не се тоа, само ми мејл или се разговара со мене, и јас ќе бидете сигурни дека ќе го добиете тоа. 

Така да со тоа, денес ние ќе се обидеме да се зборува за JavaScript. Значи тука сме Томи, кој сум само да разговараат со вас минатата ноќ. Сакам Томи. JavaScript е неговата омилена јазик, како што вели тој тука. Тие ќе се обидат и да ви кажам дека тоа е не е најдобар, и тие ќе бидат во ред. Значи Томи е да го вклучите Javascript господар. Јас не сум сосема во неговиот ниво, но јас бев како, "Томи, како можам да ги учат овие деца да го вклучите Javascript? " Значи, добив неколку совети, па се надевам дека тие работат надвор. 

Така неколку работи кои треба да се знае е дека JavaScript е клиент-side scripting јазик, па со оглед на PHP е нешто кои ги смета за повеќе од страна на серверот, тоа беше испратите до серверот, Составувач и егзекутирани таму. Ова се извршува на вашата машина. Во ред? Така да се вчита некои го вклучите Javascript-страница, и го извршува на Вашиот компјутер. Синтаксата е многу сличен на C и PHP. Ние сме случува да поминат низ некои примери на JavaScript, и си оди да се види дека начинот на кој ние се зборува за променливите, петелки, и условите се многу слични. Во ред? Фактот дека тие се толку слични е веројатно нема да се патувањето некои од вас нагоре, во некои случаи, само затоа што ќе се вклучат малку C таму каде што не треба да биде. Можеби се обидувате и напишете нешто кога тоа не треба да се внесе. 

И на тоа, едно нешто да се знам е дека го вклучите Javascript- е динамички отчукува јазик како PHP. Значи, ако вие момци се сеќавам од делот на минатата недела, кога бевме работејќи нашите PHP несреќата се разбира, видовме како стринг би можело да биде се претвори во цел број еден, и така натаму. Тип на променливите се утврдени во рок време, така што тие може да го промени текот на За време на програмата, и на ист начин на кој што никогаш навистина прогласи видови на PHP променливи, ние ќе треба да се прават истото нешто овде, каде што ние не сме навистина контрола на видови на нашите променливи, така да се каже, како што го правиме во В. 

И тогаш едно нешто тоа е прилично кул е кои можете да ги грешка провери преку конзола, со оваа голема функција console.log, што ви овозможува да печатите на различни променливи или предмети кои ќе се зборува. Исто како и минатата недела, кога бев како, "ја користите оваа функција", со депонија од вашиот pset ова е функција сакате да го користите, console.log. Бев толку изненадени колку многу студенти на работното време не знаат за депонија функција. И јас бев како, "момци, ова ќе го направат вашиот живот многу полесно. " 

Сите во право, па тоа беше вид на само еден краток работа, како и секогаш, Имаме примери. Знам дека вие момци сакам оние. Па еве еден пример на многу едноставно го вклучите Javascript-датотека тука. Така, тоа е само ќе треба да се создаде овој pop-up кој се вели дека, "Здраво", кога ќе влезат на страницата, но ајде се обиде и да одат преку овој малку. Значи очигледно ова е само како и вашата нормална index.html. Значи, само нашата нормална дефиниција тука, и ние имаме HTML, имаме нашата глава, и исто како и со CSS, како ние вклучени некои надвор датотека, нели? Имаме некои скрипта тип текст кој е да го вклучите Javascript. И изворот е hello.js, кој е овде долу. Ова е целата датотека на hello.js. И тогаш имаме некои насловот и некои тело HTML дека ние не навистина се грижат. 

Што се случува е, кога ќе се вчита оваа страница, тој автоматски ја извршува оваа скрипта. Во ред? Така ќе го вклучите Javascript- се изврши автоматски. Значи она што се случува да се направи, тоа се случува веднаш да одат и да се изврши тоа. И тоа се случува да се каже, "тревога. Здраво светот ". Кои алармирање е функција која всушност генерира оваа кутија. Во ред? Така, тоа е вид на сите вградени. Нема ништо екстра моравме да се направи освен само на алармирање, а потоа она што сакавме во рамките на нашите алармирање кутија. Во ред? Значи тоа е само супер едноставен пример за тоа што го вклучите Javascript-може да го направи. 

Една од навистина кул работи, како што ќе видиме, е тоа што ви овозможува да го вклучите Javascript да манипулира со вашите веб страни, без да се да ја превчитате во секое време. Значи, ако сте want-- на пример, ако ќе се лебди над нешто, ако вие момци некогаш имаат види како менија, или кога ќе лебдат над некои тема, се појавува опаѓачкото мени, тоа е затоа што на JavaScript. Во ред? Значи, вие не сте претовар на целиот страница да се добие ова мени да се појавиш, сте само барате некои специфични акција што корисникот има преземено, кои се нарекуваат настани кои ние ќе добиете во, и штом еднаш ќе сфатат тоа, така да се каже, "Добро, уредувате нешто на овој страница и да го направите да изгледа различно, но само уредувате овие специфични нешта. Не ја превчитате целата работа. " Така, тоа всушност е многу поубав, и вие не мора да ја превчитате вашите страници, и тоа е навистина кул. 

Значи променливи декларации, па можете вид на може да се види, Ја ставив на врвот тука, лабаво отчукува. Значи ова е многу слично на PHP. Ние не треба да се каже Го вклучите Javascript-тоа каков тип ние сме очекуваме секој од овие променливи да биде. Тие можат да бидат без оглед на видот сакаме. Значи, ќе забележите во овој случај, ние прогласи нив многу едноставно, само со "var" а потоа и што сакаме нашите променлива име да биде. Една работа е да се напомене е дека кога ќе се var стави во предниот дел на името на променливата, тоа локално тоа опсега. Во ред? Тоа е сосема прифатлива за вас целосно да се избрише само var и само треба е еднаква на CS50, и дека само ќе биде глобална променлива. Во ред? Така можете да го иницијализирам двата начини, само зависи од тоа колку што сакате. Значи, ако сте иницијализацијата тоа во функција, и сакате таа променлива да остане scoped во рамките на таа функција, сте ќе сакате да го направите нешто како var името на променливата, наспроти ако сакате тоа глобално scoped, можете само може да го направи името променливата, а потоа она што би сакал да го постави еднаква на. Во ред? 

Ова е вид на кул работа овде долу, бидејќи ако забележите нашата променлива б почнува како вистина. И што е ова does-- може некој да ми каже што ова го прави? Значи имаме некои алармирање. Што би тип на б да биде на почетокот? ПУБЛИКАТА: Булова. ALLISON BUCHHOLTZ-о: Булова. Токму така. И тогаш преназначаване б на овој стринг, нели? Па тогаш тука, она што вид на б биде? Тоа би било низа, нели? Значи она што е важно да се се забележи е дека во C, ние речиси никогаш не можел да го стори нешто слично. Ние ќе треба да имаат променлива, фрли како нешто друго, можеби и направи некои функција со две Јас, одат од обвинение во цел број. Но, ако ние се забележи, б многу лесно се менува тип. 

ПУБЛИКАТА: Чекај, па може да се само биде како "направи б цел број?" 

ALLISON BUCHHOLTZ-о: Да. Вие само може да преназначаване б цел број. 

ПУБЛИКАТА: Навистина? 

ALLISON BUCHHOLTZ-о: Да. И тогаш тоа ќе биде цел број. Така да твојот променливи можат да се менуваат со текот За време на програмата премногу. Тие не се строго го напишале. Тоа е многу лабаво отчукува. Во ред? Во суштина променливите можат да прават што тие сакаат, како што вид на виде со PHP. Тие можат да прават некои луди работи, па важно е да се биде прилично внимателни. Име на променливите добро. Ако не, не сите одеднаш си оди за да биде како, "Чекај, јас мислев дека ова е стринг, а сега тоа е int, и јас не сум баш сигурен она што се случува тука. " Значи ова е само еден едноставен пример на кои покажуваат како променлива може лесно да промени својот тип во текот на програмата. 

OK. Значи, ова би требало да изгледа супер, супер познато. Значи овие се нашите јамки во JavaScript. Тие се исти, освен за наместо четири int i е еднаква на нула, ние може само да се каже var i е еднаква на нула. И тогаш можеме да имаме ист вид на состојба, истиот вид на надградба, Јас плус плус работи само парична казна. Значи, четири се исти, whiles се исти, и не whiles се исти. Ист вид на општ формат. Забележуваме, четири, загради, загради, тоа е сеедно. Исто така ќе има semicolons Кога ќе го примерот код. Ќе видите дека е доста многу исти како и c. 

За функцијата декларации, повторно, многу слични. Имаме некои функција која само вели дека тоа е во функција, а потоа името на нашата функција, и влезови. И повторно, ако ние забележуваме, ги немаат типови тука она. Зарем не? Ние немаме ништо велејќи дека овие треба да бидат ints или двојки, или пловки. Тие можат да бидат она што тие сакаат. Она што е важно е да забележи дека ние треба да се напише функција однапред за да го вклучите Javascript-се знае дека ова е всушност функција. 

Значи ова е само некои едноставни сума функција која враќа x или y, а потоа она што е, исто така, кул е дека всушност можете да доделите функција на променлива. Значи во овој случај, сума е сега функција што всушност го прави сума. Значи ако забележите дека овде, имаме функција, име на функција, влезови. Зарем не? Тука треба само функција и влезови. Значи ова се нарекува анонимен функција. И ова е нешто што треба да бидат нови за повеќето од вас момци, ако не и сите од вас. Значи, во основа она што значи тоа е дека ние не треба да се името на нашата функција во овој случај. Ние само може да се каже, "Добро, јас ќе одам да имаат оваа функција која извршува, тука се неговите влезови, и еве она што се случува да се направи. " И, особено кога сте доделување функција на некои променливи дека си оди за да се манипулира, Вие не мора нужно треба да го именува, бидејќи ви се случува да се однесуваат на неа од страна на оваа променлива име, а не со она што функцијата е, всушност, наречен. Во ред? 

Значи, ако ние ја видите тука, ние имаат некоја променлива сума сега што е еднаков на Збирот на три и пет. И ние би го добивате ова. И ова само ќе треба некои алармирање, три плус пет еднаква на број. Ова плус само ќе concatenate Без оглед на нашите Одговорот беше на јажето. Исто така кул, плус може да concatenate жици. 

За да го вклучите Javascript, како со PHP, HTML, CSS, и како што рековме, многу од тоа ние сме вид на преземање на обука тркала исклучите тука а вие момци имаат многу знаење како да навистина се разбере овие работи. Тие се малку различни, но тие не се толку странски и дека не може Google работи или изгледа за нив на интернет со W3 училишта. И ние сме навистина ве очекуваме момци да, вид, експеримент и да учат на свој. Па, знам дека ова може да изгледа малку помалку темелно од некои од в нешта што го правиме, но тоа е, всушност, со причина. Но, се надевам дека тоа не е премногу различни, и тоа не е огромно. 

Значи низи во JavaScript, повторно многу, многу слични. Зарем не? Имаме некои променлива низа тоа е еднакво на празни загради, и тоа е само празна низа. Ова е често нарекуван буквална низа нотација. Тоа е само едно нешто што го нарекуваат. Ако гледаме низа две овде, имаме некои буквална низа која има три елементи, нели? И тогаш имаме некои var третиот елемент кој е некои променлива тоа е само случува да се одржи овој стринг, ЈС. 

Елементите, добро е да се забележи, се одделени со запирки, исто како што би се очекувало. И ти исто така да пристапите до овие, како што направивме во C, со овој индекс нотација, нели? Сосема различни од PHP Сега, ние ќе се вратам да се само вид на повикување да работи со индекс. Исто како и Ц, тоа е исто така нула индекс. Се чувствувам како тоа ќе биде навистина сурови ако тие одеднаш направи го вклучите Javascript-еден индекс, и ти мораше да целосно преиспита начинот на кој размислуваме за низи. 

Една кул работа е тоа што наместо на морале да do-- ако некогаш сакаше должината на низата, можеби ќе iterate преку него додека не се најде некој крај, или вие само ќе знаат што е тоа. Бидејќи го вклучите Javascript-е многу лабава во повеќе погледи, отколку само тип, како што гледаме тука, ние само може да се направи оваа низа поголеми, бидејќи ние одлучи да. Ако ги забележите низа три има три работи кои треба да се започне, но потоа одеднаш, ние сме како, "О, само се шегувам. Ние сме, всушност, се случува да се направи 101 работи. " Значи, ако некогаш сакате да ги знаете Крај на должината на низата, да го стори тоа како оваа. И ние си оди за да се види многу на оваа нотација во примери, но со вклучите Javascript- тоа е обично она што објект што го зборуваме за точка секаков вид на функција сакаш да се применува на него. Во ред? 

Значи во овој случај, нашите објектот е низа две, и ние велиме ние сакаме должината на низата две. Значи ова е само нарекува како должината на тоа. И тоа ќе се врати должина. Исто така нешто да се напомене е дека ако ние забележиме нашите низи, за разлика Ц, тие немаат за да се сите од ист вид. Ова е многу повеќе како PHP. JavaScript е во основа, само како оваа интересна meld на C и PHP. Затоа ние ќе навлегувам во тоа. За сега, ајде да претпоставиме дека вашиот низи се во основа како C низи, во кој тие се нула индексирани. Добро, така што тоа е сè. Можете исто така да само се прошири на низа на она индекс што го сакате. Со оглед на ова, најверојатно, ќе СКГ грешка на вас или да ви даде некои грешки, JavaScript е како, "Не, тоа е во ред. Ја добив оваа. Ние само ќе одат директно каде што сакате да. " 

Добро, така што предмети се многу важни. Вие момци ќе биде со користење на многу од овие во вашиот P сет, ако се сеќавам точно. Значи она што овие се сличен на C се structs. Значи, можете да се сетите кога about-- одиме на пример правото По ова Мислам дека тоа ќе направи многу повеќе sense-- но ние во основа ги користат објектите за да организираат се разбира поврзани со информации. Кога зборувавме за structs во C, ние често се зборува за еден студент кој имаше некои име, Проект, куќа, знаете, концентрација. И тоа е вид на истото дека ние ги користиме објекти за тука. Тоа е само да се организира слични информации. 

Можете исто така да мислам на овие што се повеќе слични на асоцијативни низи во PHP. Значи ова ќе биде вид на работа каде што имаме некои клучни со некоја вредност, многу сличен на PHP. Така може да се иницијализира некои празен објект, како што гледаме тука, само со големи загради. Така низите се квадратни загради. Празна објекти се големи загради. Добар разлика да го имаат. И овие се само две различни начини да се постави својства. Значи ова е вид на многу повеќе на начин кој е сличен на PHP, со нашите асоцијативни низи, со нашите клучни, и нашата вредност, додека оваа is-- испишан гледаат оваа многу повеќе во JavaScript. Оваа тенденција да се биде на конвенцијата. И во истиот начин на кој ние го сторивме низа две точки должина, ова е велејќи дека, "Во ред, дај ми ова атрибут на овој објект. " Зарем не? Значи, на ист начин како што беше како, "Дај ми должина атрибут на низа две " ова е велејќи: "дај ми некои имотот на нашите празни објект. " Или во овој случај, ние сме пренесување на некоја вредност тука. Но вие исто така би можеле да пристапите на тој начин. 

А потоа, тука тоа е само покажува две различни сигнали. Значи ова ќе се покаже на сигнали ќе биде иста, тоа е само два различни начини на пристап до елемент што го сакаме. Дали тоа се направи смисла на сите? Се чувствувам како оваа веројатно го прави повеќе смисла, само затоа што ние сме излетаат на PHP. Но, како и да правиме вакви примери, ова е буквално иста. А многу од тоа е само промена на синтакса. 

Добро, така примери. Сакам примери. Значи тука е некои CS50 променлива која е објект, и ни ги чува сите овие информации во врска со тоа. Значи имаме разбира, инструктор, TFS, psets, и снимено. Значи ние забележуваме овие се речиси сите на различни видови. Зарем не? Значи предмети може да се сместат атрибути на различни видови. Можеме да мислиме на this-- тоа е многу слична на нашата асоцијативна низа во PHP. Значи клучот, вредност, клуч, вредност, клуч, вредност, па натаму и така натаму. Она што е исто така интересно на ист начин дека можеме да имаме низи во низи, ние, исто така, може да има објекти во предмети, или низи во рамките објекти. Никогаш не сте навистина ограничени на само еден од оние нешта. Ние може да се добие многу Inceptionesque, само Продолжувам да одам надолу зајакот дупка таму. 

Значи, ако ние забележуваме, ги Се разбира дека има некои е стринг, инструктор кој е стринг, и низа, еден int, и Булова. Значи, сите овие различни нешта. 

Сите во право, тогаш, имаме уште еден. Значи во овој случај, имаме низа од објекти. Па само како објект може да има низа во неа. Ние, исто така може да има низа од објекти. Ова може да биде корисно да се размислуваат за слична вид за тоа како ние имавме хаш маса, имавме низа на сите овие различни видови на structs дека беа совети за различни јазли и какво ли не. Но, во овој случај, имаат низа на предмети. Значи ова е како низа на асоцијативни низи. Значи имаме некои Првиот елемент ќе биде предмет со името Џејмс и куќа Winthrop. 

Вие момци нема да се сеќава нешто многу слично на ова, при вашето последно pset, каде што ако извади нешто од вашата база на податоци, првиот вид на нешто во вашата низа беше сите информации во врска со првиот корисник што го сретнавме, и тогаш ќе мораше да индекс во кој да се добие нивните акции или нивните кеш или какво ли не. Значи ова е многу исти работа, само една мала промена во синтакса, малку промена во зборовите што ги користиме за да ги опише. 

Значи, ако сакаме, секој може да се каже ми што ова предупредување ќе се направи? Или она што ова малку код ќе го направи за нас? ПУБЛИКАТА: Тоа ќе ви даде сите имиња. ALLISON BUCHHOLTZ-о: право, па тоа само ќе ги алармира со сите имиња бидејќи тоа ќе оди преку куќа јас, така што ќе почнат од нула. Значи тоа би рекол, во ред што го барате на овој прв објект, кој е првиот слот во нашата низа. Таа вели: "дај ми го атрибут, името на тој објект. " Значи ќе одиме тука, ние би скенирање, ние ќе се најде име, и ние би ги испечатите Џејмс, Моли и Карл. Било какви прашања досега? За жал го вклучите Javascript- си оди за да биде прават многу угледување на вашиот сопствена земја, да пронајдат синтакса, бори со него. Но, се разбира, јас сум секогаш тука, работното време се секогаш тука. Би можел да бидам во вторник оваа недела. Значи, ако сте таму, можете да доаѓаат посетите мене оваа недела. Тоа би било одлично. 

Добро, така ДОМ е-документ Object Model. Значи ова е само начин дека ние сакаме да мислиме за тоа како нашата HTML и сето во неа се организира. Ова е многу нешто што најверојатно ќе излезе на вашиот квиз. Знам дека моите година, тоа беше како еве HTML датотека, пополнете во ДОМ за тоа. А ти само го пополните мали нешта. Тие треба да бидат лесни поени надевам. Се надеваме дека ќе see-- 

ПУБЛИКАТА: [нечујни] 

ALLISON BUCHHOLTZ-о: Значи ќе го видите ова дрво тука? 

ПУБЛИКАТА: Да. 

ALLISON BUCHHOLTZ-о: Значи, тие ќе побараат употреба да се пополни во она што се случува во телото. Можеби под телото, имаме некои divs или имаме некои ставови, и ние ќе побара од вас да се пополни во дрво многу се допаѓа ова. Затоа ние ќе се шетаат низ него. Значи, документ-објект Модел е само начин да структура и да размислуваат за нашите HTML графички. И, исто така, кога ќе го добиеме во повеќе JavaScript, тоа се случува да биде начинот на кој ние, всушност, манипулира со различни елементите на страната. Ние треба начин за пристап до секој на нештата во нашиот HTML, па така ова ни дава многу бетон стандардизиран начин низ различни веб страници, за да го направите тоа. 

Значи, ако ние само одиме преку ова тука, се разбира нашиот документ е како целата наша датотека. Тоа очигледно го прави смисла дека тоа е највисок работа, а потоа ние си имаме вистински HTML, што одговара на овој таг тука. Исто така, ако во алинеја вашиот тагови правилно, тогаш креирањето на овој DOM-стебло стане супер едноставен. Значи имаме некои главата тука. Имаме некои органот кој можеме да видиме матични исклучување на HTML, која е причината зошто имаме главата и телото. Во рамките на главата, имаме некои Насловот таг, крај наслов таг, Па знаеме дека доаѓа по главата. И во нашиот наслов ознака, имаме здраво, свет. Во ред? Значи тоа е целата оваа левата рака гранка. И тогаш за десната рака гранка тука, ние гледаме дека имаме HTML, Добро сме го правеле ова главата дел, ние сме во потрага само на телото, па ние имаме некои тело област. И во тоа, само нешто што го имаме е здраво, свет. Во ред? Ако имавме вакви работи некои заградата П, а потоа Здраво, свет, а потоа уште заградата на стр збогум, свет, ќе имаме две меурчиња кои доаѓаат надвор од овде. Затоа што тие се и под телото, но тие се посебен ставовите овој случај. Постои дефинитивно пракса за тоа во претходната квизови, како и многу онлајн на неа. OK, па, тоа само им овозможува на ни да види сè убаво и манипулираат работи многу систематски. Во ред? Ние знаеме како точно да се напречни преку ова дрво, па ние знаеме што сакате да пристапите. 

OK, па тоа е причината зошто ние сакаме да имаат овој вид на модел, така што можеме да го користиме вакви работи, и ние го разбираме она што тие значат, и тие се стандардизирани низ сите она што го правиме. Значи насловот на документот точка е само насловот на our-- сите овие се прилично само објаснување, Сакам да мислам. Па првите три примери се само велејќи, "Во ред, само дај ми Насловот на оваа веб-страница. " Значи тоа ќе ви даде она што одговара на насловот. 

Документ точка тело ќе ви даде се што е во рамките на тие телото тагови. Така може да се манипулира со тоа. А документ точка точка на телото внесете HTML е многу кул една, а можеби и не е како супер интуитивен, но внатрешниот HTML одговара на ова право тука. Значи, ако некогаш сакаш да манипулира со текст на страницата, обично си оди за да се прави нешто со телото точка внатрешниот HTML. Во ред? Значи внатрешниот HTML има тенденција да се однесуваат на она што е, всушност, меѓу овие тагови. Во ред? И тогаш корисни функции. Значи, ако се сака да се добие било која од овие, било кој елемент, ние имаме некои лични, класа име, или име на етикета. Ова е многу слична на работите што го правевме со CSS, нели? Каде што имаме некои селектори дека одговара на било таг, класа дека ние нив, или лична даде. Ова е многу многу на ист начин. Ако имате нешто што има некои класа на куче, и велиш добиете елементи по име на етикета, и да се стави куче во there-- или Жал ми е, Име класа. Може да се стави точка во таму. Тоа се случува да се врати на сите оние елементи на вас, кои имаат таа класа. Така може да се манипулира само оние. На ист начин, можеби само сакаат да манипулираат некои насловот, па некои H1 заглавието, како што правевме. Вие би можеле да добиете елементи од таг име, бидејќи Н1 е име таг. И на ист начин, ако сакате да се добие некои уникатни нешто, може да се добие таг. Земете елемент со лична карта. И тие се, всушност, многу од овие. Ова се само како три од многу многу. Значи, ако одите на интернет, како Одам да се поттикне можете да го направите, а не некои истражување на свој, Јас дефинитивно препорачувам гледајќи во сите од нив. Тие можат да бидат супер корисно, особено кога сакате да само вид на манипулација многу конкретни работи без да се оди преку и да се обидат да го анализирам од сè. 

Добро, па последното нешто е да го вклучите Javascript настани. Значи, кога зборував на почетокот за да оди преку веб-сајтот, и кога ќе лебдат над нешто, или глувчето лебди над нешто, нешто се случува. Тоа е она што ние би сакале да се размислува за како настан. Значи она што го имаме кои би можеле да да биде корисно тука е OnClick. Па мојата беше на кружење, која, сигурен сум прилично сигурен, е само за кружење. Исто така еден тон на овие кои можете да барате. Има цела листа на интернет на различни нешта дека можете да ги преслушате. 

Но JavaScript настани се во основа, само одговарање на работите дека вашето корисничко се прави. Зарем не? Така да твојот корисник не нешто, тоа е еден настан, и го вклучите Javascript ќе одговори сепак сакате тоа да се. Тоа ќе одговори соодветно. Значи во овој случај, имаме некои прозорец точка вчитан. Па што е ова, вели, "Чекај до натоварени на прозорецот. " Во ред? Значи, кога сè е вчитан, вчитан, тогаш можете да ја извршат оваа функција. Значи, кога сè е натоварен, си оди да има некои копчето за пребарување кој добива елемент со лична карта, и отпечатоци што и елемент е како го копчето за пребарување. И тогаш имаме оваа променлива, ние се каже, "Во ред, OnClick." Значи, кога ќе слушнете клик на копчето за пребарување, вршење на оваа функција, што е алармирање, сте кликнале на копчето за пребарување. 

Значи она што се случува is-- ова е убаво малку графички приказ тука. Значи, нашата документот товари, тоа е нашата вчитан, ќе најдеме нашите Барај копчето, што е ова. Ние сме во потрага за нашите Барај копче. И тогаш кога копчето за пребарување е кликнато, што одговара токму тука. OnClick. Тогаш ние конечно се алармираат нашите корисници, што е тоа последната линија тука. Во ред? Значи секој од овие четири чекори само одговара на четири кутии таму долу на дното. Дали тоа се направи смисла на сите? 

И тогаш едно нешто што јас сум само ќе зборуваме многу, многу кратко, дека јас Ги охрабрувам момци да Барајте повеќе во е jQuery, што е само една библиотека кој е изграден на врвот на JavaScript. Тоа е супер корисно, како што со повеќето библиотеки. Постојат голем број на функции. Значи, ако има нешто што некогаш сакате да го направите во JavaScript, Вашиот прв инстинкт не треба да биде да се мисли на "она функција треба да Јас код? "Треба да биде, "Дозволете ми да видам некој е веќе го направи тоа за мене. " Бидејќи девет пати од десет, некој ќе го направиле тоа веќе, и тие веројатно да го направи подобро. Луѓето поминуваат многу време го прават овие, и го вклучите Javascript-е многу широко се користи, па луѓето се постојано обидувајќи се да го направи тоа подобро. И jQuery има многу функции кои најверојатно ќе бидат корисни за вас во твојот последен проект, ако сте прави ништо со веб дизајн. Што сакам да кажам, "работа попаметно и полесно ". Ако вие момци го направите тоа, тоа ќе биде одлично. Кога сме на Hackathon Јас не сакаме да бидеме сите стрес. Сакам да бидам како: "Јас добив ова. jQuery доби мојот грб. Јас не треба да пишувам овие функции. " 

Па само две работи да се се сеќавам, јас ќе одам да ви момци изгледа повеќе во jQuery за своја. Сите Одам да го кажам е тоа прави некои прилично страшни работи и можат да го направат вашиот живот во целина многу полесно. Но, она што сакате да го имате она што е датотека дека си оди за да се го користите во, сте ќе сакаат овие две линии. Сте ќе сакате сценариото на jQuery js js точка. И всушност, вашиот извор се случува да се направат одредени URL-то. Ако на Google jQuery, Гугл всушност е домаќин на сите датотеки за вас. Значи, вие дефинитивно сакате да влез овој URL наместо тоа. Јас само се стави ова овде Заради полесно. Сето ова значи е каде да се најдете вашиот jQuery библиотеката. Тоа е голем, па да не сакате да го домаќин на свој компјутер ако може да се избегне, која е причината зошто ние имаат тенденција да само стави во URL-то на Google, домаќин на сите овие датотеки за вас. Во ред? Можете да го Google, јас ветувам тоа ќе биде таму. 

И тогаш што Го вклучите Javascript-датотека кој сте користење, така што ова е само некој надворешен Го вклучите Javascript-датотека кој сте го користите. Во истиот начин на кој што водат до нашите CSS датотеки, ова е истиот вид на работа. Ова само линкови до датотеки каде се вашите вклучите Javascript-е. И јас имам некои примери со едноставни JavaScript. Затоа ние ќе се оди преку него. И тогаш во вашиот индекс на JavaScript, која е вашата вклучите Javascript-датотека тука, ова е вид на обвивка кои имате за jQuery. Ти си речиси 99,9 проценти од времето случува да ја имаат оваа во вашиот index.js датотека. Поради тоа што ова вели дека е, "Не се изврши ништо додека вашиот документ е, всушност, подготвени ", која е токму она што го сакате. Затоа што ако вашиот документ не е подготвена, и jQuery започнува вршење на работите, тоа е само хаос. Значи секогаш сакаат да ја имаат оваа обвивка. А потоа и за работи кои одат во таму, се остава свој perusing вашиот момчиња ". 

Добро, така што постојат било какви прашања во право сега за да го вклучите Javascript воопшто? Или моделот ДОМ? Ако не, ние имаме некои кул примери кои може да се оди преку, дека вие момци можат да ми помогнат код. Но, јас сум исто така, ќе биде супер убаво, и ако не сакам да кажам нешто за овие, тоа е во ред. Јас исто така, може само да ви даде примери. Но, ништо на PowerPoint, пред да преминеме на? Кул. 

Се чувствувам како вие момци треба да ги енергија. Па јас мислам дека ние сме случува да се започне со мојата партија пример во прв план. Имаме три примери, имате вашиот избор. Значи ние треба часовник, каде одиме за спроведување на вистински часовник, кој е случува да се ажурираат, како времето одминува. Ние ја имаат оваа голема Твитер функција. This-- знаеш што, се издржи. Ние сме случува да се направи тоа оди далеку. Бам. OK. 

Ние ја имаат оваа голема Твитер функција тука, that-- знам, нели? Тоа се случува да биде одлично. Дали сте возбудени момци? Тоа се случува да се брои бројот на знаци кои сте го напуштиле, Значи, ако сум тип во моментов, Очигледно, тоа сè уште вели 140, но ние знаеме дека тоа не е случај. И тогаш со нашите последен тука, кликнете тука за да се забавуваат. Што ќе се случи е кога ние кликнете, позадината е ќе се промени бои. Значи вие момци имаат вашите опции на кој сакате да се направи првата. Ветувам дека ќе го правиме тоа многу лесно за вас. Се чувствувам како секој е вид само многу ниска клуч денес. Затоа јас ќе ви прошетка низ тоа како ние ќе ги спроведе сите од нив. Ако сакате да свири во, тоа е одлично, но јас се чувствувам како сите се малку уморни. Па јас само ќе ви прошетка преку овие примери. Дали имаме нешто што ние би сакале да се направи прво? Секој? Без преференци? OK. Знаеш што? Ние сме на партијата. Се чувствувам како вие момци треба little-- Значи, ние ќе го стори на партијата прво. OK. 

Значи она што го имаат here-- тоа е не би требало да биде таму. Сега тоа е добро. OK. Значи она што го имаме тука е само едноставна HTML страница дека вие момци сите треба да биде супер запознаени со од вашиот последните две psets. ние си имаме doc тип тука. Дали секој се види? OK. Кул. Ние имаме HTML очигледно. Имаме некои насловот дека е поврзани со стил лист кој само го направи мојот фонт убав и голем и смел. Затоа не треба да се грижите за тоа. 

Имаме некои тело со лична позадина, во ред? Бидејќи ние си оди за да биде менување на позадина. Значи, кога ние сме се менува позадината на нашето тело, ние се сеќавам од пред две недели кога ќе се занимаваат со веб-страници. Па добро да го имаат тоа. И ние имаме некои Id еднаква на партијата. Ова ж код фунти само значи дека тоа се случува да одат на истата страница. И кликнете тука за да се забавувам, кој е зошто кога ќе кликнете на неа, тоа треба да се менува бои, за среќа. 

И тогаш имаме некои скрипта тука е само поврзана со оваа партија точка js датотека, дека е празна, бидејќи не сме го направиле ништо сеуште. И тоа е толку тажна. Но, многу скоро, тоа ќе се промени бои, и тоа ќе биде неверојатна. 

Па јас сум само ќе ви прошетка момци преку тоа како ние би можеле да се зафатиме со ова. Така првото нешто што ние можеби ќе сакате да се направи, ако ние се менува позадината на телото, првото нешто што можеби ќе сакате да направите е, всушност, го дофати што телото е, нели? Значи, сакаме да имаме Накусо, во нашите позадина, и ако забележите, Јас само автоматски само на проектот пишување. Нема ништо посебно што ние треба да се направи за нашиот JavaScript датотеки. Јас може да започне прогласување променливи, и прогласување случаен функции. И тоа е многу повеќе слободна форма. Тоа е како со C, ние ви даде сите овие тешки правила, а вие пораснав, па ние сме како, "одат натаму. Бидете слободни. Прави што сакаш. " И тоа е она што го вклучите Javascript-е. Значи ние треба некоја позадина тука. Со нашите ДОМ модел, ние знаеме може да се направи документ точка добие елемент, и ако ние се забележи, Нашето тело има лична карта. Зарем не? Значи можеме да се добие документ со ID, и тука е едноставен. Што е нашата број кој сакаме тука? ПУБЛИКАТА: Позадина. ALLISON BUCHHOLTZ-о: Позадина. Перфект. И запирка на крајот. Тоа не исчезнала уште. Вие сеуште треба вашата semicolons. OK. Значи тоа е нашиот прв. И кога ќе кликнете на нешто, ние сакате нешто да се случи, нели? Значи, ние можеби ќе сакате некои променливи кој е на чекање за клик. Она што се случува да се направи е тоа што се случува да се направи нашата врската повеќе сличен на едно копче. Значи ние си оди за да имаат некоја копче што еднаква документира точка добие елемент со лична карта. И ако јас зборувам за кликнете на линкот или кликнете тука за да се забавуваат линк, што би можело да ми Id биде тука? Партија. Точни. Добро не е премногу лоша досега. Секој се добие она што го правиш? 

Добро, па сега ни копчето, и ние сакаме работите да се променат кога ќе кликнете на неа. Значи, ако ние се сеќаваме од нашето PowerPoint, многу едноставна работа што можеме да направиме е само копчето точка OnClick, нели? И тоа се случува да се изедначи на некоја функција. Ова е анонимен функција. И ова е само as-- всушност јас сум случува да се направи ова малку поголем. 

Значи она што го направија тука сакам да кажам дека, во ред, кога ќе кликнете нашите копче, кое е овој линк, кој ние само се наведени, ние ќе се обидеме да се изврши овој анонимен функција. Ние не се потребни никакви влезови. Ние не се грижат што корисникот вели. Кога ќе кликнете на неа, ние сме ќе го направи она што го сакаме, што е промена на боја на позадината. Во ред? Значи тоа е причината зошто ние не имате било какви влезови, ние само треба овој анонимен функција. И сега ние сме всушност, се случува да ја напишам оваа функција. 

Значи има еден куп начини можете може да генерира случаен боја. Начинот на кој што го направив беше да се генерира три случајни броеви и да ги конвертирате во еден RGB трокреветни. Значи ова само ви покажува некои кул работи што ако сте како, "О, Јас мора да се генерираат случајни број. "Ако го Googled, тоа е она што ќе го најде. 

Значи, имаме три различни работи, var, а не пак црвена, зелена. Зарем не? Значи тоа се трите нешта кои го сочинуваат боја. Сина, црвена и зелена боја. Кул. И она што можеме да направиме е она што го знаеме дека тоа треба да биде помеѓу 255, и ако сте виделе некои генератор на случаен број, можете да добиете нешто како математика точка случаен избор, кои, ако се погледне на овој горе се враќа во некои број помеѓу нула и еден. Во ред? И што правиме броеви RGB тројки одат помеѓу? Нула и што? Што можат да одат до? 255. Значи, ако математика точка случаен избор оди помеѓу нула и еден, како можеме да сакате да го конвертирате ова? ПУБЛИКАТА: Време? ALLISON BUCHHOLTZ-о: Да, точно. Значи време е 255. 

ПУБЛИКАТА: [нечујни] Тоа е како [нечујни]. ALLISON BUCHHOLTZ-о: Математика точка случаен избор. ПУБЛИКАТА: Кул. ALLISON BUCHHOLTZ-о: Да. Го вклучите Javascript-само се грижи за вас. OK. Значи можеме да го направи тоа за сите од нив. Зарем не? Математика точка случаен избор пати 255. Копија од тоа. Кул. Значи, она е, ова може да не се врати цел број. Зарем не? Можеби и ние да се добијат некои број помеѓу нула и еден, и тоа предизвикува тој да биде малку надвор, а нашите RGBs не може да биде присутна. Тие треба да бидат ints. Значи, ако сте се обиделе ова, би веројатно има некои непредвидливото однесување. Тоа ќе биде малку фанки. Значи она што го правиме ако сакаме да се направи Осигурајте се дека овие се заоблени, и може да се заокружи било начин. Се заокружува со подот. Па јас секогаш се сигурни дека заокружени. Но случува надвор од тоа како едноставна беше само да добие случаен број, како да се мислиме можеби кат овој број? Тоа е многу сличен. Секоја идеја? Значи, ако случајно беше само математика точка по случаен избор, па мислите дека ние би го сторила подот? Математика точка подот. И ти исто така може да направи математика точка таванот. Тркалезна ти е вид на двосмислена Бидејќи вие не знам дали да се заокружи или круг надолу. Па обично ние секогаш направи математика точка кат, математика точка таванот. Но honestly-- 

ПУБЛИКАТА: Дали кат круг долу? 

ALLISON BUCHHOLTZ-о: кат заокружува надолу. И тоа е само избор за мојата улога. 

Така, сега имаме три броеви кои биле случајно генерираниот, и она што ние ќе треба да направите сега е ние сме само се случува да се промени позадината. Во ред? Значи ние веќе имаме позадина вид на складирани во овој елемент се нарекува позадина. Значи она што ќе забележите е, ако ќе одигра околу со тоа, ние сакаме да го промените стилот. И ова е вид на нешто што ќе Google и дознаам, Како како да се промени бојата. 

Но начинот на кој можете да пристапите на оваа боја е позадина точка точка стил позадина. Значи ова е велејќи дека со оглед на овој објект, позадина, кој се однесува на тоа елемент Id таму горе, ние ќе се погледне на стил во стил, ние ќе треба да се погледне во позадина. Во ред? И ако одат и да бараат на овој горе, тоа би можело да се направи малку повеќе смисла, Но, ова е во основа само велејќи, "Ми даде овој многу специфичен атрибут од она што сум го дефинира порано. " Значи она што ние сме го менува за да се некои RGB, бидејќи тоа го прави смисла. Ние сме користење на RGB тројки, нели? И ние have-- сакам да бидете сигурни дека јас добиле вистинскиот број на цитати од тука. Значи она што го правиме е тоа што имаме RGB, и ние ќе to-- ова е како конкатенација, кој е црвена. И тогаш ќе сакате некои запирка. И тогаш сакаме плус зелена, тогаш некои запирка, а некои сина боја. 

Значи овие предности само значи како сплет. Значи ова е само создавање на овој стринг што се случува во рамките на RGB. Во ред? 

ПУБЛИКАТА: [нечујни] плус тогаш зелените плус тогаш црвено. 

ALLISON BUCHHOLTZ-о Да, бидејќи јас збркана дека до. Дека еден е во ред. Ах, се издржи. Не Затоа што треба да бидете сигурни што ја добив сите овие право. Па јас ќе објаснам во ООН Momento. Зелена, сина, совршена. Сега јас сум се направи. Верувам. 

OK. Па што е ова, е дека позадината ќе треба да се постави на некои стринг. Зарем не? Што е она што го имаме овде. Тоа се случува да биде некој RGB 255 запирка 255 запирка нула, или број што го има таму. Значи правиш тука, ние имаме некои стринг. И она што сакаме да го направиме, е ние сме вид на динамички создавање дека кога ние всушност ја извршите оваа програма. Значи ова е некои стринг. Плус тоа concatenates со вредноста што има црвена, кој concatenates тоа со запирка, што concatenates со она што е зелена, и така натаму, и така натаму. Во ред? До самиот крај, која е затворање загради на овој RGB тука. Во ред? 

Значи она што ова се случува да генерира некоја команда навистина тоа е RGB од три броеви дека позадината е сега во собата да. Во ред? Значи, да се види дали тоа функционира. Се надевам дека го прави тоа, бидејќи ако тоа не, јас ќе одам да се биде вистински тажен. О, не. Добро, се издржи. Дефинитивно позадина точка точка стил позадина. Јас сум дефинитивно недостасува нешто само мал. Не сте момци мразам тоа? Кога тоа е само мал малку грешка? Семоќниот позадина. RGB. 

ПУБЛИКАТА: [нечујни] ALLISON BUCHHOLTZ-о: Не Се обидов ова пред класа. Имам се што направи пред класа во случај јас бев како, "Чекај, што направив погрешно?" Бидејќи јас бев како, "Јас веројатно ќе хаос овој горе во одреден момент. " Плус зелена. Сè што изгледа како да е concatenated правилно. OK. 

ПУБЛИКАТА: [нечујни] 

ALLISON BUCHHOLTZ-о О, и таму да одите. Тоа е она што ми треба. Погледни го тоа. Тифани за спасување. Перфект. OK. Сега да видиме дали таа работи. О Боже. OK. Чекај. 

ПУБЛИКАТА: простор по втората плус. 

ALLISON BUCHHOLTZ-о: Кој? О чека, се издржи. Простор носат? 

ПУБЛИКАТА: Втора плус зелените сплет. ALLISON BUCHHOLTZ-о: О. ПУБЛИКАТА: Нема простор по плус, да. ALLISON BUCHHOLTZ-о: Вие не е потребно тоа, but-- ПУБЛИКАТА: О, не? ALLISON BUCHHOLTZ-о: Тоа изгледа убаво. ПУБЛИКАТА: Добро. OK. 

ALLISON BUCHHOLTZ АУ: Да видиме дали тоа функционира. OK. Јас сум очигледно не на ова демо, што ме потсетува на предавање на други недела, но знам дека тоа ќе работи. Знам дека ова ќе работат. Толку блиску. Ако јас не случајно избришани мојата скрипта на оваа. Не, тоа е партија точка js. Добро се издржи. Одам да го копирате ова, и јас сум исто така, само ќе го избришете сè, бидејќи имав оваа работна порано. 

Јас ветувам дека таа работи. Ако не, јас ќе ви покаже што е Томи. И таму. 

ПУБЛИКАТА: Ти си референцирање партија дот, CSS, и тоа е една партија точка js. 

ALLISON BUCHHOLTZ-о: Ах, добро тука е партија точка js. Добро, што сум направил поинаку? Добро, ќе видиме дали ова работи сега. Бам. Значи, јас не го знам она што го направив поинаку, но тоа е она што треба да се случи. Kinda кул. Јас кликна на ова, како, засекогаш. Но, можеме да се обиде и да се види она што го направив поинаку дека оваа имал. Не знам за вас момци, но ова изгледа во основа она што јас само напишав. Имаше веројатно исчезнати точка и запирка некаде е моја работа. Всушност, откако, мислам дека беше недостасува точка и запирка токму тука, всушност. Но, јас не можеше да го види, бидејќи тоа беше надвор од екранот. 

Но, ако ги забележите, ова е прилично многу точно она што јас само напишав. Мислам дека веројатно најтешкиот дел за ова е само вид на тоа нешто во право тука, разбирање она што таа го прави таму. Овие видови на нештата ќе научат навистина само со Googling и чесно само се обидува. Ако мислите дека некои атрибут, таму веројатно е. Значи да го пробате. Погледнете што се случува. Како што реков, има многу на експериментирање со вклучите Javascript-, и PHP, и сето тоа работи, и CSS, особено. Тоа е единствениот вистински начин да го разбере. 

Добро, па после тоа фијаско со партијата точка ЈС, имаме две други опции. Имаме часовникот или Твитер. Тие се двете интересно. Можеби не е толку забавно како партија, кои имаа излади малку strobing работа на крајот. Дали вие момци имате било какви предност? ПУБЛИКАТА: часовникот? ALLISON BUCHHOLTZ-о: часовникот? OK. Кул. 

Значи, повторно, ние си имаме празни вклучите Javascript-датотека. И како што гледаме тука, ние има некои многу едноставни HTML. Ние имаме стилот на состојба, што само формати на она што треба да изгледа. Ние имаме div со идентификација на часовникот, којшто само вели дека "ова треба да биде часовник." И ние имаме линк за нашите вклучите Javascript-датотека што е, всушност, ќе генерираат нашите часовникот за нас. Бидејќи кул работа, е дека можете да Го вклучите Javascript-се постави автоматски да се освежи себе. Во ред? Така, наместо да чека за корисникот да ја погоди Освежи на страницата така што ќе може да се добие ажурира времето, го вклучите Javascript- може да го ажурира сепак го сака. 

Значи, како и со нашиот последен еден, сакавме за пристап до нашата позадина, нели? Па што мислиш може да биде Првото нешто што сакате да го направите тука? Ако ние сме вид на се исклучуваа овој вид на парадигмата тука? Ние веројатно сакате да пристап до нашите часовник, нели? Значи, имаме некои var часовник, кој equals-- она што мислиме дека тоа нема да биде? Документ точка добие елемент by-- Јас, исто така сакам Sublime-- ID и нашите Id е часовникот. Точка и запирка. Мора да бидете сигурни дека за да се добие оние semicolons тоа време, бидејќи чувствувам како тоа беше проблемот за последен пат. OK, па, како што беше само велејќи дека со обидот за да го вклучите Javascript-се освежи, има оваа голема функција, јас знаат дека тоа дојде во рака минатата година, Не сум сигурен што доаѓа во удобен за ова pset, но тоа се вика сет интервал. И ова е, всушност, навистина кул, ако вие момци се направи нешто со текот на времето или добивање ажурирани информации. На веб-сајтот за конечна проект, ова е веројатно на функцијата што сакате да добиете супер запознаени со. Значи она што го поставите интервал не е тоа ние ќе треба да го даде функција, и колку често треба да нарекуваме оваа функција. Во ред? 

Значи во овој случај, ние сме само ќе создаде некои анонимни функција повторно, ОК, тоа се случува да се нашите датум, и за нашето време, а потоа и ажурирање работи и прикажување на тоа. Затоа ние ќе се грижи за тоа. Ние ќе биде како да генерираат часовник тука. Но, она што ни треба е како често да го одмориме. Значи во овој случај, тоа е само милисекунди. Значи ние сме само ќе направи 100 милисекунди. Се разбира, сосема произволна. Ако сакаше тоа да го обновите многу побавно, што би можеле да. Ние можеме да се плеткаме околу со сет интервал, колку е голема нашата интервал е откако ќе го добиеме часовник кој работи, кој се надевам дека ќе се стигне. Значи ова е само велејќи, "Добро, повик оваа функција секои 100 милисекунди. " Во ред? Тоа е се што прави. 

Значи она што го сакаме нашиот функција да направите е да сакаме да имаме некои денот и некое време е она што ние сме случува да имаат. Значи можеме да го започнеме со нашите датум еднаква на нешто, и за нашето време е еднакво на нешто дека се 'уште не се знае. Или, всушност, ние само треба денес, бидејќи датум се случува да се вклучат сè. Повторно, ако само на Google нешто во врска со што сакате да направите, ако се напише, "Добро, Сакам да се добие време користејќи JavaScript ", се ќе ви даде овој голем функција наречена датум добие. Буквално, повеќето нешта што сакате да направите, Го вклучите Javascript-се случува да имаат тоа го прави за вас веќе. Така, тоа е буквално како нов да добиеме датум, кој е creating-- или нов датум, rather-- кој е генерирање на некој предмет што претставува датум. 

И она што се случува да го направите тука е ова is-- јас ќе одам да се напише ова, а потоа објасни она што го прави. Затоа јас ќе бидете сигурни дека да се добие тоа право. 

Добро, така што оваа функција не, е дека ние сме само создавање на HTML тоа е, всушност, нема да оди во рамките на нашите div id на часовникот. Па што ова се случува да се прави е само генерирање на некои стринг, во ред? Тоа е тогаш ќе биде трансплантирани во нашиот HTML. Во суштина она што тоа се случува да направите е што we-- она ​​што јас ќе ви покажам е дека што и да каже HTML е, ние ќе треба да го замени овој текст тука со што HTML е. Значи, тоа се случува да се овозможи нас да го промениме нашиот часовник точка HTML од тоа да биде само на текстот на овој треба да биде часовникот, да всушност покажуваат броевите и работите кои ние се грижиме за, и, всушност ќе биде часот. 

Значи она што ние ќе треба да направите е да сме случува да се започне генерирање на оваа HTML. Значи, во истиот начин на кој ние се користи да се направи плус еднаква на целите броеви, сега можете да го стори тоа за жици, освен тоа се случува да ги concatenate. Зарем не? Како што видовме со партијата точка ЈС, тоа само concatenates сите овие работи заедно. Така можете да concatenate различни делови од HTML код променливи, или делови од жиците што ќе се напише себе, и тоа само навистина Ви овозможува да се динамички генерира HTML, што е прилично кул. Значи, ако имате нешто многу лесен за специфични, ова може да ви овозможи да го направите тоа. 

Значи имаме HTML, да јас ќе одам да се обиде и да бидете сигурни дека да се добие тоа право. Значи ние се случува да се направи некои H1 заглавието. Значи она што е важно да сфатат тука е дека ова е всушност само HTML. Зарем не? Ви пишуваме вистински HTML кодот во тука, тоа е не само една нишка во нормална начин на кој можеме да се размислува за тоа. Значи имаме некои HTML. Ова се смета за низа тука, секако. И тоа го правиме денес ние dot-- сакаат да ги добијат нашите часа. Повторно, ако сте во ситуација да се погледне до нешто во врска со датумот, тоа ќе ти кажам сите тие се атрибути кои денес ги има. И тука е она што можете да го користите на неа. Тоа, најверојатно, има работи како добие часа, и да добијат минути, и да добијат секунди, и да добијат милисекунди, и кој знае што друго тие имаат. Но, ако погледнете во документација, сето тоа ќе биде таму. 

Значи ние треба да се добие часа, а потоа ние би сакале да concatenate дека with-- Јас сум ќе се движи овој овде. Значи, ако ние сме генерирање моментов, ние сме всушност генерирање на време, нели? Имаме часа, а потоа она што е меѓу часови и минути? Имате запирка, нели? Значи, сакаме да се направи некои запирка тука. И тогаш сакаме да се добие ни минути, така што на ист начин што го имаме денес точка добие часа, како можеме да ги добиеме нашите минути? Тоа е буквално и биде доделен датум точка добие минути, што јас вид на се допаѓа. Тоа е како, "О, колку можам да добијам моите минути? " Јас само се добие мојата минути. 

OK. И тогаш имаме уште дебелото црево тука. И тогаш, ако сакаме да се добие ни секунди, како можеме да ги добиеме нашите секунда? Датум точка добие секунди. Мислам дека тоа е прилично кул. И она што е важно да се се реализира, е дека ние, исто така, треба да ги затвориме нашите HTML таг тука, затоа што сепак треба да биде валиден HTML, па Н1. Кул. 

Па после тоа, ние може да го направи часовник точка внатрешниот HTML-от е еднаква на HTML. Во ред? Значи се сеќавам како што реков внатрешниот HTML основа се 'што е помеѓу две тагови кои ние разговаравме за и внесува или манипулира она што е таму? Значи она што го прави ова, ако ние се вратиме на нашите часовник, е дека часовникот се однесува на сè што е во овој div. Ова е внатрешниот HTML Id на овој часовник div. И тоа така се случува да ја промените да HTML кодот што ние едноставно се генерираат, кој, што, се надевам, се надевам, се надевам, ќе се покаже на момент. Ќе видиме. Се разбира. Толку многу технички проблеми. Just-- Алисон Јас сум ми игра денес момци. ОК, тоа функционира. точка внатрешниот часовник на HTML. Тоа беше HTML Навистина? Исто така, тоа е она што се случува. Кога не може да се види нешто, само погледнете во вашиот изворен код. OK. Дали сакате да знаете кул работи околу дека ние ќе треба да се направи во право тука? 

ПУБЛИКАТА: Можете ли да направите големи букви? На големи букви? Бидејќи имате добиете часа, и потоа да се минути. 

ALLISON BUCHHOLTZ-о: Тоа е да се добие часа и get-- ох. Вие are-- злато ѕвезда. Сето ова е тест, момци. Јас ветувам дека тоа е работа пред класа. 

Добро, но нешто кул да знаете е дека можете да also-- ако понекогаш вашиот надворешен датотеки се добивање малку луд, можете исто така да само да ги стави директно овде, која има тенденција да ги среди работите. Освен ова е како навистина грди. Се разбира форматирате сè. Бидете сигурни дека тоа е сите прилично. OK. 

Сакав да го направите сите кул демо снимки, и тие се само не работат надвор. OK. Сценарио var часовникот. Относнотова, она што е важно е дека ова е општ начин дека ќе го форматирам JavaScript. Како што можете да видите, тоа може да биде многу претрупан понекогаш, дури и кога беше буквално работа пред две секунди. Или не пред две втори, но многу, многу скоро. 

Па да ви го покаже она што треба да изгледа, и да ти докажам дека не сум луд, и дека сè е токму исто, тоа е она што треба да изгледа. Ти си само случува да го направите ова горниот дел тука, и ако видите изворниот, ако забележите, тој ја направи некои полуда работи, јас го поедноставен. Исто така, кредит на Томи McWilliam, кои, всушност, ми помогна да се создадат овие примери, кој е зошто јас знам дека тие работат. Бидејќи Томи е да го вклучите Javascript господар. Но, ако ги забележуваме, ги има некои сет. Ние имаме функција на часовникот тука. Ова е за сите што го вклучите Javascript- ние само напишал, или некои од нив. Ние само го напишал ова, токму тука. И тој има екстра функција која само го влошки со поставување на нула пред писмо или пред голем број ако е само еден од нив. Значи ако забележите дека, ова е прилично многу точно она што ние само напишав. Имате некои променлива часовник кој има нашата елемент, се елемент по проект, која е часовникот. Ние имаме сет интервал функција, тоа е анонимен функција која извршува сето ова. Имаме некои почнуваат низа HTML кој потоа ќе можеме динамички генерира со тоа што некои H1 заглавието, concatenating со добие часа, плус нашите дебелото црево, плус добива записникот, плус уште дебелото црево, плус нашите секунди, и на крај завршува HTML за тоа. И тогаш ние ажурирање на нашите часовник точка внатрешниот HTML во HTML, и ние се ажурира на секои 100 милисекунди. Во ред? 

Види Ветувам дека не сум луд. Не знам. Не знам зошто не ми се допаѓа. Се чувствувам како изгледа исто, но очигледно тоа ме мрази. 

Значи, да се види дали круг три оди подобро. Ние сме за да ја видите. Не сум сигурен како тоа се случува да одам. Е секој барем добивање на лошите страни, како само на општата тема на JavaScript, иако? Се надевам дека тоа е најмалку корисни, повеќе од кои покажуваат дека тоа е малку претрупан. Но, вашиот проблем во собата ќе биде многу забавно. Тоа се случува да биде одлично. Тоа нема да биде толку мачна како ова, јас не мислам. Вие, всушност, ќе се дојде до види навистина кул работи. 

Значи, последно, но не и најмалку важно, ние ќе се обидеме на еден месец. Јас сум навистина исплашени сега, момци. Не знам како тоа се случува да одам. Но, само за да ви даде малку повеќе вкус, а тоа е, всушност, манипулирање со жици и влезови, она што се случува да се направи е, ако ние се забележи со HTML-- и оваа има малку more-- имаме некој текст област, која одговара на овој текст областа тука. Во ред? И што има ID на текст. Ние тоа го сменил малку со некои ширина и висина дека ние сме предодредени, и ние сме Н1, која само е нашата насловот оној кој ги претставува нашите карактери. Ние ја даде некои Id на преостанати карактери, и тогаш имаме некои скрипта тука, за што јас сум навистина надевајќи се дека по трет пат е шарм тука, момци. 

Значи она што сакате да го направите, во ист основен вена што ние го направивме со часовник точка js и партиски точка js како што сум забележал, е ние сме отворени од страна всушност грабање работите кои ние се грижиме за, нели? Значи во овој случај, постојат два работите кои ние се грижиме за, во ред? Едно нешто што ние сме всушност вид на гледајќи во и цртање податоци од, и едно нешто што ние сме всушност се менува. Па таму е нашиот HTML. Ако ова е нашата веб страница овде, што е податоците што ги барате? Тоа се случува да биде што текстот во нашата кутии, нели? Значи она што го пишувате тука. Тоа е она што сакам да знам, или тоа е она што сакате да се погледне. И она што се случува да биде менување на нашата веб-страница? На преостанати карактери. Значи, на ист начин, ние сакаме да започне со иницијализацијата променливи кои, всушност, се држат овие елементи. Во ред? Значи, ако имаме некои var тоа е нашиот текст област, и ние имаме некои var што преостанува. Зарем не? Значи овие се случува да држете тие две работи. Значи на ист вид на работа, документ dot-- Добро, јас сум случува да бидете сигурни дека тоа е оди на работа тоа време. Јас сум многу непопустливи. Добро, па ако сакаме нашиот текстуалното поле, според на нашиот HTML, што е нашиот идентификатор? Што е нашата ID? Тоа само ќе биде текст, бидејќи ова го создава нашиот текст област, во ред, и нашите Id е текст, така што е како можеме да го зграби она што е таму. Добро, точка-запирка. Одам да се биде супер прецизен за тоа, затоа што сакам ова да работи тоа време. Добро, го прават истото, добие елемент со лична карта. Јас сум навистина се прашувам што има предизвикани од другите две да се плеткаш. Добро, тогаш во овој, што сакаме да пристапите? Што е наша лична тука? Имаме уште еден проект во нашиот HTML, што е тоа? ПУБЛИКАТА: преостанати карактери. ALLISON BUCHHOLTZ-о: Преостанати карактери. 

OK. Кул. Па јас сум само ќе напишам ова навистина брзо. Јас сум само се случува да пишувам ова во секунда. Значи текст. Она што е интересно е B function-- таму многу функции кои не само што одговара на вашиот глувчето, но вашата тастатура. Во ред? Така може да се каже кога било кое копче е притиснато, можете да ги правите нештата како тоа. Значи она што ние сме со користење се нарекува за клучните нагоре, што вели: "ако сте притисне било кое копче за вашата тастатура, кога корисникот ќе ја укина прстот исклучи дека копче, и клучните стана unpressed, тогаш ние ќе треба да се направи нешто. " Во ред? Значи, тоа го прави смисла, нели? Затоа што секој карактер ние тип, ние ќе мора да се укине нашите прстите од него, па кога клучот оди нагоре, можеме да знаеме да Намалување на нашите преостанати карактери. 

Значи ние треба некои клуч за нагоре, и на ист начин, ние сме случува да се каже, "Добро, кога тоа го правиме, ние се случува да се создаде некоја функција што се случува да се земе е ", во овој случај, и она што сакате да го направите е пресметување на преостанатите бројот. Добро, па ајде да започнете преку создавање на променлива. Значи имаме некои променлива R, кој нема да претставуваат колку знаци сме го оставиле. Во ред? Ние знаеме дека ние започнуваме со 140, и ако сакаме да знаеме, да речеме, должината на овој низа што е создадено влез, Дали ви момци имаат било каква идеја како да го направите тоа? Само базирана на очигледните работи, како и ако сакаме часа, ние се користи за да се добие часа. Ние знаеме дека нашата цел е текстуалното поле, но дали вие момци мислам на она што може да дојде по неа? Сите идеи? 

Значи ова е вид на помалку интуитивни, но тоа е вредност точка должина. Па само да ми даде некои вредноста на атрибутот што е всушност должината на овој стринг. Значи, тоа се случува да се каже, "Добро, јас сум во потрага на целата оваа низа во текстуалното поле, а јас ќе одам да се каже можете колку долго е тоа. " Бидејќи, ако ние се сеќаваме на жици се навистина само низи, па ние само може да се земе должината на нив. Значи ние треба тоа. Кул. 

Потоа она што сакаме да го направиме е ние никогаш не сакаат да им овозможи на корисникот да го внесете повеќе од 140 карактери, нели? Бидејќи, ако кажеме како, "О, ти имаат само ова многу останатите " а потоа нека го направи тоа Относнотова, ние сме биле лаже. И ова е уште еден Она што го вклучите Javascript- може да биде навистина добар за, е корисник валидација и правење на сигурни дека вашата корисникот вклопува во сите правила дека сте се предвидени за нив. Значи, ако сакате да ги правите нештата како да се прави дека некој влез на нивните е-мејл адреса, или да се направат сигурни дека кога ќе влезе во две лозинки, тие се исти. Го вклучите Javascript-може да го направи тоа. Ќе се направи нешто како, "кога форма се доставува, "или слично, "Кога достават образец копче е кликнато, проверете ги сите овие работи. " И ние може да го направи тоа JavaScript. Значи тоа е само она што ние ќе треба да го направите тука. 

Значи она што може да биде начин да се провери дали тие си отиде повеќе од 140 карактери? Што ќе се случи со нашата вредност на R доколку се обидат? Тоа се случува да биде негативен, нели? Или тоа се случува да биде помалку од или еднакво на нула. Значи, ние може да се користи, ако тоа е исто како и сè друго. Во ред? И ние имаме некој текст област точка вредност, и она што го правиме тука е ние сме само cutting-- што е тоа? Жал ми е. Оваа една, ние едноставно сакаат да се вратат лажни. Јас се збуни. Сите истрошен од работите не работат. Добро, ние само сакаме да return false, а потоа ние сакате да се прикаже Останатите карактери, нели? Така е и со часовникот, ние го сторивме нешто со внатрешниот HTML, нели? Каде сме ние го постави еднаква на некои променлива, така што можеме да го правиме тука? Што сме ние менување на внатрешниот HTML кодот на? 

ПУБЛИКАТА: Останата? 

ALLISON BUCHHOLTZ-о: Ние сме менување на останатите. Сите права се, и она што ние сакате да го поставите еднаква? Тоа се случува да биде R, бидејќи тоа треба да биде нашиот преостанати карактери. Во ред? Затоа, јас сум навистина нервозен за да се види дали ова работи сега, но ќе видиме. Оставете го тоа. Тоа е навистина брзо. [Нечујни] ред. Повторно, јас сум само ќе ви покаже. За која било причина, рудникот одлучи да не работат, но она што јас ќе ви покажеме е дека ова is-- ох јас требаше да се стави дека во. Добро, ќе забележиме истиот вид на работа тука, впуштајќи се во текстуалното поле. 

Исто така, ако човек известување, ако има некогаш нешто што сакате да направите, а вие не знаете како да направите тоа, само кликнете на View страница извор, и тие ќе ти кажам. Понекогаш тоа ќе биде криптирана. За ваша pset, ние го криптирате сè, па тоа само изгледа како глупост. Но, ако има некогаш навистина кул веб-сајт кој ви се допаѓа, ако само кликнете Преглед на кодот на страницата, тоа се случува да ви кажам како да го направи тоа. Значи, повторно, се работи попаметно, а не потешко. И како што гледате тука, на сите овие работи се исти. ова овде само зема некои подниза дека, заборавам токму она што овој го прави тоа. Но, тоа очигледно зема некои подниза на вредност од нула до десет, и се враќа false што треба да престанат корисникот од внесување на повеќе, и тогаш очигледно ажурира внатрешниот HTML таму. 

Кул. Значи големи преземе бесплатни работи од денес, експеримент, погледнете во изворниот код затоа што тоа се случува да ви помогне многу, и сите, понекогаш го вклучите Javascript- може да биде тешко да се работи со и не секогаш да работи на начинот на кој што се очекува да се, туку само се обидувам бидејќи јас ветувам дека ќе. Јас ветувам дека сите овие примери работевме пред класа. Не ми е јасно што се случило. Јас буквално се што е иста. 

Уште една работа што сакам да го ви покаже момци кои можат да бидат супер корисни е in-- што работеше и пред тоа? Добивме партија на работа, не ние? Јас мислам така. Да. Ние го сторивме. Прекрасно. ОК, значи едно нешто што вие момци треба да ги знаете е конзолата најавите дека говорев. Значи конзола точка најавите на здраво. Значи ова е вид на Го вклучите Javascript-еквивалент од printf. Значи, ако некогаш сакаш да прегледате вашиот променливи или да видиме што се случува таму, што можете да го направите е, ако ние ја испита елемент, е она што сакате да одите да, а вие одете на конзола, ќе видите дека тоа печатени здраво. 

Значи, ние би можеле да го имаат Верзија за она што сакавме. Ако сакавме да се печати позадина точка точка стил позадина, ние треба да бидеме во можност да ја видите RGB тројно што доаѓа до. Или не. Заборавам како точно печати променлива како што, но треба да бидете во можност да печати работи како што. Тоа ќе биде многу корисно за pset кога сте се обидува да манипулира координати и какво ли не. Значи, тие исто така се промени ова парче во својата класа. Ова е различно од последните години, па само било убаво да вашиот TFS, или TFS на работното време, а, бидејќи ние сме вид на учење заедно со вас момци. Но конзола најавите беше супер, супер помош за да го вклучите Javascript минатата година. Значи тоа го сакаат. Научете како да го користам. Тоа е полесно да се користи од GDB, така што треба да биде најмалку еден плус точка. Но, ви благодарам момци се носат со мене. Жал ми е што мојот примери за некоја причина едноставно не сакаат да соработуваат со мене, но јас се надевам дека тоа помогна вид на се што е малку повеќе во зоната на JavaScript. И ме испрати на сите ваши прашања за следната недела, така што може да се супер поправени, и јас ќе донесе слатки, па дури и дополнителни бонбони бидејќи тоа беше смешно. Но, вие момци се одлични, и имаат одличен недела.