1
00:00:00,000 --> 00:00:02,690
[Powered by Google Translate] [Seminar: jQuery]

2
00:00:02,690 --> 00:00:04,790
[Vipul Shekhawat, Universitatea Harvard]

3
00:00:04,790 --> 00:00:08,000
[Aceasta este CS50.] [CS50.TV]

4
00:00:08,000 --> 00:00:10,640
Dacă sunteți în urma de-a lungul la domiciliu, puteți accesa de fapt, diapozitive mele on-line

5
00:00:10,640 --> 00:00:13,310
de a merge la acest link.

6
00:00:13,310 --> 00:00:18,650
Este TjjRWj, pe bit.ly.

7
00:00:18,650 --> 00:00:20,700
De asemenea, poti sa te duci doar la URL-ul direct,

8
00:00:20,700 --> 00:00:27,300
care este cloud.cs50.net / ~ vshekhawat, care este numele meu,

9
00:00:27,300 --> 00:00:32,409
și jQuery.

10
00:00:32,409 --> 00:00:34,920
Am foarte recomandăm să urmați de-a lungul, dacă te uiți de la domiciliu,

11
00:00:34,920 --> 00:00:40,650
si daca esti aici, de asemenea, că aceasta este o prezentare destul de interactiv.

12
00:00:40,650 --> 00:00:43,160
>> Așa că astăzi am de gând să fie vorba despre jQuery, iar prima întrebare este,

13
00:00:43,160 --> 00:00:45,300
Ce este jQuery?

14
00:00:45,300 --> 00:00:47,090
În acest an, eu știu voi nu s-au acoperit JavaScript

15
00:00:47,090 --> 00:00:51,080
în cât mai multe detalii avem în ultimii ani.

16
00:00:51,080 --> 00:00:53,150
JavaScript este, în primul rând, doar un limbaj client-side

17
00:00:53,150 --> 00:00:58,390
pe care le utilizați pentru a rula script-uri și cod pe calculatorul fiecarui utilizator.

18
00:00:58,390 --> 00:01:00,660
Deci, aveți un server care oferă pagini de web la oameni,

19
00:01:00,660 --> 00:01:02,600
dar s-ar putea dori să facă lucruri pe masina lor,

20
00:01:02,600 --> 00:01:08,060
cere masina lor de a trimite cereri la server la fiecare 30 de secunde sau ceva de genul asta.

21
00:01:08,060 --> 00:01:10,420
Puteți face acest lucru cu ajutorul JavaScript.

22
00:01:10,420 --> 00:01:13,190
JQuery oferă doar o funcționalitate mai pe sus de activarea JavaScript-

23
00:01:13,190 --> 00:01:15,680
care face lucruri în plus pentru tine.

24
00:01:15,680 --> 00:01:17,710
Dacă te uiți la conținutul de pe partea de sus,

25
00:01:17,710 --> 00:01:21,410
care descrie unele din lucrurile pe care sunteți în stare să facă.

26
00:01:21,410 --> 00:01:23,500
Deci, în general, a fost creat în ianuarie 2006.

27
00:01:23,500 --> 00:01:26,560
Acesta a fost primul conceput în august 2005.

28
00:01:26,560 --> 00:01:31,370
A fost în jur de câțiva ani, și este într-adevăr o parte din noii mișcări Web 2.0

29
00:01:31,370 --> 00:01:34,330
care a făcut Internet, astfel strălucitor.

30
00:01:34,330 --> 00:01:37,630
Este biblioteca JavaScript cele mai utilizate pe scară largă.

31
00:01:37,630 --> 00:01:41,450
Peste 19.6 milioane site-uri sunt folosind-o, iar utilizarea este în continuă creștere

32
00:01:41,450 --> 00:01:45,640
potrivit builtwith.com, care, se pare, în ultimul an,

33
00:01:45,640 --> 00:01:49,710
tocmai a fost în continuă creștere destul de liniar.

34
00:01:49,710 --> 00:01:52,870
Printre primele 10 de milioane de site-uri, există încă -

35
00:01:52,870 --> 00:01:55,180
aproximativ 40% dintre acestea sunt în prezent folosind.

36
00:01:55,180 --> 00:01:58,540
Facebook foloseste, o mulțime de alte site-uri se utilizează în prezent.

37
00:01:58,540 --> 00:02:01,540
Poti sa te uiti la aceste statistici pe cont propriu, dacă doriți.

38
00:02:01,540 --> 00:02:05,820
Și ai putea spune că este legal, deoarece are o fundație și 13 membri ai consiliului de administrație,

39
00:02:05,820 --> 00:02:11,910
împreună cu o echipă de 20 de oameni care lucrează pe ea în mod regulat.

40
00:02:11,910 --> 00:02:16,110
Deci, este utilizat pe scară foarte largă, ea are un URL org., E fantezie,

41
00:02:16,110 --> 00:02:21,660
ea are de spin-off-uri pentru alte lucruri, asa ca este o afacere mare.

42
00:02:21,660 --> 00:02:24,510
>> De ce ar trebui să-l folosească? JQuery este foarte ușor.

43
00:02:24,510 --> 00:02:27,270
Asta înseamnă că nu este un fișier imens. Puteți descărca

44
00:02:27,270 --> 00:02:31,540
fișierul minified, care este, fără tot spațiul alb și comentarii, și este doar 32 kB.

45
00:02:31,540 --> 00:02:33,600
Deci, este ușor să arunci pe pagina dvs. web

46
00:02:33,600 --> 00:02:35,910
și doar a începe să utilizați-l.

47
00:02:35,910 --> 00:02:39,630
Este, de asemenea, scris foarte eficient, astfel încât să nu ia o mulțime de -

48
00:02:39,630 --> 00:02:42,550
nu încetini site-ul dvs. mult atunci când este utilizat.

49
00:02:42,550 --> 00:02:45,770
Acesta vă permite să pună în aplicare lucruri care au fost imposibil anterior.

50
00:02:45,770 --> 00:02:47,790
Există unele aspecte ale funcționalității,

51
00:02:47,790 --> 00:02:51,780
cum ar fi crearea de animații, care in mod normal ar fi foarte, foarte dificil de a face.

52
00:02:51,780 --> 00:02:54,300
Dar în jQuery ele sunt de fapt foarte simplu.

53
00:02:54,300 --> 00:02:57,040
Și există unele lucruri care sunt enervant de a face,

54
00:02:57,040 --> 00:02:59,610
posibil în JavaScript, cum ar fi trimiterea unei cereri POST,

55
00:02:59,610 --> 00:03:02,190
dar pentru a trimite o cerere de la un server, va trebui să scrie

56
00:03:02,190 --> 00:03:04,320
cinci sau șase sau șapte linii de cod.

57
00:03:04,320 --> 00:03:07,200
Acum o poti face doar într-o singură linie de cod, într-un apel de funcție unică.

58
00:03:07,200 --> 00:03:11,790
Care simplifică într-adevăr o mulțime de lucruri pe care le faci.

59
00:03:11,790 --> 00:03:15,950
Și toți copiii se răcească îl folosesc. Prin aceasta, mă refer la mine.

60
00:03:15,950 --> 00:03:19,270
În proiectul meu final de anul trecut, care este news.whrb.org,

61
00:03:19,270 --> 00:03:22,530
care este pentru postul de radio, am creat acest blog

62
00:03:22,530 --> 00:03:29,750
care găzduiește toate spectacolele pe care le-am făcut și fișiere MP3 pentru ei.

63
00:03:29,750 --> 00:03:32,070
Puteți naviga prin spectacole trecut,

64
00:03:32,070 --> 00:03:34,130
si totul se face folosind jQuery. Puteți să spuneți

65
00:03:34,130 --> 00:03:37,340
din cauza tuturor acestor animații, în esență.

66
00:03:37,340 --> 00:03:42,360
Deci, dacă aveți - dacă creați un nou mesaj,

67
00:03:42,360 --> 00:03:45,980
veți vedea aceste slideDowns mici, care sa terminat cu jQuery.

68
00:03:45,980 --> 00:03:49,140
Și acest lucru se estompeze - pentru ca astfel de lucruri se tot face folosind jQuery,

69
00:03:49,140 --> 00:03:52,720
și nu trebuie să reîncărcați constant pagina pentru a naviga pe site-ul.

70
00:03:52,720 --> 00:03:57,220
Un alt lucru misto care a făcut folosind jQuery este aceasta prezentare.

71
00:03:57,220 --> 00:03:59,700
Sunt folosind acest lucru open source numit scrolldeck,

72
00:03:59,700 --> 00:04:03,250
care cineva a scris pe partea de sus a jQuery.

73
00:04:03,250 --> 00:04:04,870
Dacă te uiți de fapt la sursă, se poate vedea că

74
00:04:04,870 --> 00:04:07,830
ei folosesc acest semn dolar, semne dolar

75
00:04:07,830 --> 00:04:12,110
sunt utilizate în jQuery pentru a semnifica faptul că o funcție este o funcție jQuery.

76
00:04:12,110 --> 00:04:15,020
Deci, acestea sunt definirea unui înveliș pe partea de sus a jQuery

77
00:04:15,020 --> 00:04:18,570
care vă permite să facă o prezentare ca aceasta,

78
00:04:18,570 --> 00:04:21,200
și puteți vedea că aici ei, inclusiv fișierul jQuery inițial,

79
00:04:21,200 --> 00:04:24,120
care este ceea ce va trebui să includă, dacă doriți să utilizați jQuery

80
00:04:24,120 --> 00:04:30,450
în propriile site-uri web.

81
00:04:30,450 --> 00:04:32,790
>> Referindu-se la faptul că, cum a face tu-l instalați?

82
00:04:32,790 --> 00:04:36,150
Puteți merge doar la jQuery.com și descărca fișierul,

83
00:04:36,150 --> 00:04:38,320
adăugați-l la un director web și să o includă.

84
00:04:38,320 --> 00:04:42,200
Deci, doar pe partea de sus, în tag-ul cap de fișier HTML

85
00:04:42,200 --> 00:04:45,400
din principal de fișiere HTML, trebuie doar ca linie de cod

86
00:04:45,400 --> 00:04:49,490
cu versiunea corectă pentru ce versiune de jQuery pe care îl utilizați.

87
00:04:49,490 --> 00:04:51,340
Îl puteți descărca de a merge la jQuery.com,

88
00:04:51,340 --> 00:04:55,130
faceți clic pe "Download jQuery," și le-ați luat. Asta e tot.

89
00:04:55,130 --> 00:04:58,880
Și, de fapt, putem arunca o privire la ceea ce pare.

90
00:04:58,880 --> 00:05:01,080
Dacă faceți clic pe descărca de aici, jQuery este aceasta.

91
00:05:01,080 --> 00:05:05,260
Este doar un mare dosar de activarea JavaScript care face toate lucrurile magice pentru tine.

92
00:05:05,260 --> 00:05:09,270
Aceasta este versiunea minified, care nu poate fi citită deloc.

93
00:05:09,270 --> 00:05:13,180
Poti sa te uiti, de asemenea, la versiunea de dezvoltare, care este ușor de citit

94
00:05:13,180 --> 00:05:15,370
dar încă foarte, foarte lung.

95
00:05:15,370 --> 00:05:17,980
Este o mulțime de lucruri acolo.

96
00:05:17,980 --> 00:05:20,240
Puteți, de asemenea, link-ul la versiunea Google a găzduit de ea.

97
00:05:20,240 --> 00:05:23,820
Deci, care va permite să se bazeze doar pe Google să le furnizeze.

98
00:05:23,820 --> 00:05:29,310
Ele oferă fiecare versiune a acestuia, disponibile în orice moment.

99
00:05:29,310 --> 00:05:31,530
Astfel încât vă puteți baza, probabil, pe Google pentru a găzdui pentru tine.

100
00:05:31,530 --> 00:05:33,270
Sau puteți lega la propria ultima versiune jQuery lui.

101
00:05:33,270 --> 00:05:36,400
Ei au un URL care este mereu actualizat la cea mai recentă versiune.

102
00:05:36,400 --> 00:05:40,850
Este jQuery-recente, și există o problemă cu asta,

103
00:05:40,850 --> 00:05:44,350
care este faptul că, dacă jQuery actualizate și o parte din funcționalitatea precedent

104
00:05:44,350 --> 00:05:47,250
ei au retrogradat sau devine învechită,

105
00:05:47,250 --> 00:05:49,620
ea nu poate - poate începe să nu se mai susținut.

106
00:05:49,620 --> 00:05:52,940
Deci, dacă ați scrie un site web folosind versiunea 1.8.2,

107
00:05:52,940 --> 00:05:55,000
de Versiunea 2.7 vine

108
00:05:55,000 --> 00:05:57,000
unele dintre funcțiile pe care le-a scris nu mai funcționează.

109
00:05:57,000 --> 00:05:59,930
Deci, este mai bine pentru a descărca doar fișierul kB 32,

110
00:05:59,930 --> 00:06:04,100
pune-l pe pagina dvs. de web, și va funcționa pentru totdeauna.

111
00:06:04,100 --> 00:06:07,450
>> Am de gând să merg mai departe și începem să vorbim despre funcționalitatea reală de jQuery.

112
00:06:07,450 --> 00:06:13,090
Primul lucru este selectoare. Aceasta este ceea ce jQuery a fost inițial conceput pentru a oferi.

113
00:06:13,090 --> 00:06:15,500
Și puteți să faceți clic pe documentația sa se uite la

114
00:06:15,500 --> 00:06:18,690
documentatie detaliata pentru selectorii am de gând să se acopere.

115
00:06:18,690 --> 00:06:24,120
Ideea din spatele selectori este că puteți selecta elemente HTML de pe o pagină.

116
00:06:24,120 --> 00:06:28,790
Elementele de pe o pagina au ID-uri și clase și alte aspecte de identificare a acestora.

117
00:06:28,790 --> 00:06:30,500
Există, de asemenea - ele? Esti la diferite comenzi.

118
00:06:30,500 --> 00:06:32,570
O parte din timp ei imbricată reciproc.

119
00:06:32,570 --> 00:06:38,120
JQuery vă permite de a construi interogări simple, care prelua elemente de pe paginile.

120
00:06:38,120 --> 00:06:41,890
Apoi, puteți manipula aceste elemente utilizarea funcțiilor jQuery,

121
00:06:41,890 --> 00:06:43,990
care este secțiunea de manipulare vom ajunge la mai târziu.

122
00:06:43,990 --> 00:06:46,040
Aveți posibilitatea să modificați HTML, schimba CSS,

123
00:06:46,040 --> 00:06:50,500
De asemenea, puteți anima și adăuga funcții care activează pe anumite evenimente.

124
00:06:50,500 --> 00:06:52,710
Deci, de exemplu, în cazul în care se face clic ceva, vrei ceva să se întâmple,

125
00:06:52,710 --> 00:06:55,210
puteți face acest lucru folosind jQuery, de asemenea.

126
00:06:55,210 --> 00:06:57,380
Și există un număr foarte mare de moduri de a selecta elemente.

127
00:06:57,380 --> 00:07:00,310
Cele mai multe dintre ele nu am folosit, dar sunt cele de bază,

128
00:07:00,310 --> 00:07:02,340
care sunt destul de importante.

129
00:07:02,340 --> 00:07:05,750
Selectorul Elementul, de exemplu, dacă sunteți selectarea doar ceva

130
00:07:05,750 --> 00:07:10,640
că este un div - de fapt, am codul deschis pentru această prezentare de diapozitive.

131
00:07:10,640 --> 00:07:13,450
Deci, de exemplu, aici e primul diapozitiv.

132
00:07:13,450 --> 00:07:17,430
Aici avem un div. Dacă vom selecta de fapt, toate divs pe pagina,

133
00:07:17,430 --> 00:07:22,300
va da-ne o serie de toate divs care există în acest fișier.

134
00:07:22,300 --> 00:07:27,040
Selectorul de identitate vă permite să selectați ceva cu o anumită identitate.

135
00:07:27,040 --> 00:07:32,230
Deci, dacă acest lucru, de exemplu, acest lucru are ID-ul "ceea ce,"

136
00:07:32,230 --> 00:07:37,160
și dacă am făcut acest lucru cu # ce în loc de un act de identitate,

137
00:07:37,160 --> 00:07:42,920
va reveni doar o matrice care are un singur element și anume faptul că elementul a paginii.

138
00:07:42,920 --> 00:07:45,490
Putem combina, de asemenea, selectoare acest mod de a avea

139
00:07:45,490 --> 00:07:48,260
doar selectați lucrurile cu ID-urile care sunt divs.

140
00:07:48,260 --> 00:07:51,810
Deci, da. Selectați doar divs care au ca ID-ul.

141
00:07:51,810 --> 00:07:55,260
Pentru clasa a utiliza doar un punct, e același lucru ca și CSS.

142
00:07:55,260 --> 00:07:57,500
Descendent, de asemenea, funcționează, deci, dacă aveți ceva de clasă

143
00:07:57,500 --> 00:08:00,170
și le-a imbricate elemente din ea - astfel, de exemplu,

144
00:08:00,170 --> 00:08:03,260
există o anumită clasă și are o etichetă ancoră pentru a lega la o altă pagină,

145
00:08:03,260 --> 00:08:08,510
puteți utiliza această sintaxă pentru a prelua legătura.

146
00:08:08,510 --> 00:08:12,420
Puteți selecta, de asemenea, mai multe lucruri în același timp, doar le separa prin virgule,

147
00:08:12,420 --> 00:08:17,360
folosiți selectorul doriți, și vă va selecta toate dintr-o dată, într-un singur tablou.

148
00:08:17,360 --> 00:08:19,650
Și apoi există, de asemenea, nu selectorul, astfel încât să puteți selecta toate divs

149
00:08:19,650 --> 00:08:24,210
care nu au unele clase specifice.

150
00:08:24,210 --> 00:08:28,790
Si acesta este doar un mod util de a obține o introducere la modul în care funcționează această selecție.

151
00:08:28,790 --> 00:08:32,270
Voi arăta câteva exemple concrete într-un al doilea.

152
00:08:32,270 --> 00:08:35,480
>> Selectoare avansate sunt - acestea sunt doar câteva exemple.

153
00:08:35,480 --> 00:08:38,840
Există zeci de acestea, dar dacă doriți să selectați toate etichetele imagine

154
00:08:38,840 --> 00:08:42,799
în termen de un element, atunci ai făcut: imagine.

155
00:08:42,799 --> 00:08:45,340
Dacă doriți să selectați elementele chiar, de exemplu, în cazul în care există 20 dintre ele,

156
00:08:45,340 --> 00:08:48,290
doriți să selectați 0, 2, 4, 6 și așa mai departe,

157
00:08:48,290 --> 00:08:51,630
faci: chiar, sau puteți face, de asemenea: ciudat.

158
00:08:51,630 --> 00:08:55,470
Acestea sunt selectori pseudo, ceea ce înseamnă că le calcula de fapt,

159
00:08:55,470 --> 00:09:00,960
orice alt element, mai degrabă decât doar merge și selectarea toate dintre ele.

160
00:09:00,960 --> 00:09:05,510
Puteți, de asemenea, - fiecare element poate avea, de asemenea, atribute specifice.

161
00:09:05,510 --> 00:09:10,580
Astfel, de exemplu, clasa = centru este, de asemenea, un atribut.

162
00:09:10,580 --> 00:09:16,500
Pentru această etichetă ancoră, href, hipertext trimitere, este un atribut de asemenea.

163
00:09:16,500 --> 00:09:21,150
Astfel, puteți alege ceva care se leagă la o anumită pagină sau pur și simplu - este foarte generală.

164
00:09:21,150 --> 00:09:25,410
Puteți alege orice cu orice atribut pe care doriți.

165
00:09:25,410 --> 00:09:27,470
Și apoi, de asemenea, atribut conține.

166
00:09:27,470 --> 00:09:30,420
Dacă, de exemplu, a vrut pentru a selecta toate elementele de intrare

167
00:09:30,420 --> 00:09:32,700
care au cuvântul "recupereze" ca numele lor,

168
00:09:32,700 --> 00:09:37,560
Dacă o pagină are un bloc de introducere a textului

169
00:09:37,560 --> 00:09:41,050
care se numește "parola", care ar fi o modalitate de ai putea selecta.

170
00:09:41,050 --> 00:09:43,020
Și acolo sunt mult mai multe. Puteți merge mai departe si uita-te la documentația

171
00:09:43,020 --> 00:09:46,950
și a vedea exemple specifice de modul în care funcționează.

172
00:09:46,950 --> 00:09:48,840
>> Următorul lucru este DOM manipulare.

173
00:09:48,840 --> 00:09:52,500
Dupa ce am selectați elemente, vom dori să facem de fapt, lucruri cu ei.

174
00:09:52,500 --> 00:09:55,500
Până acum nu ne-am uitat la asta deloc, dar dacă te uiți la documentația,

175
00:09:55,500 --> 00:09:57,950
există într-adevăr o mulțime pe care le-ar putea face.

176
00:09:57,950 --> 00:10:02,900
În acest moment, vom selecta elementele de pe această prezentare

177
00:10:02,900 --> 00:10:04,890
și manipula-le folosind jQuery.

178
00:10:04,890 --> 00:10:08,290
Deoarece acest lucru este implementat folosind jQuery, avem acces la biblioteca jQuery,

179
00:10:08,290 --> 00:10:13,580
și putem folosi aceste funcții în cadrul acestui cod.

180
00:10:13,580 --> 00:10:16,200
Un lucru util pe care poate nu știți despre este consola.

181
00:10:16,200 --> 00:10:19,340
Și Google Chrome este ceea ce eu sunt, folosind. Puteți apăsa ALT comanda J

182
00:10:19,340 --> 00:10:21,720
sau ALT de control J pentru a deschide consola.

183
00:10:21,720 --> 00:10:26,130
În Firefox Cred că e comanda schimbare K sau Shift Control K.

184
00:10:26,130 --> 00:10:28,880
În Safari trebuie să te duci modifica unele setări.

185
00:10:28,880 --> 00:10:35,460
Există o legătură, dacă doriți să-l fac, dar am recomanda obtinerea Chrome sau Firefox.

186
00:10:35,460 --> 00:10:37,750
Deci, haideți să deschidem consola, e aici.

187
00:10:37,750 --> 00:10:41,170
Acesta vă permite practic să faci doar ce vrei tu.

188
00:10:41,170 --> 00:10:45,100
Astfel încât să puteți pur și simplu tastați în a crea o variabilă numită x,

189
00:10:45,100 --> 00:10:49,200
x = 5, să vedem ce x + 2 este.

190
00:10:49,200 --> 00:10:57,670
Puteți face chiar ceva de genul CS + Să vedem, x + 45, care va fi CS50.

191
00:10:57,670 --> 00:11:00,530
Puteți face doar unele chestii tipice JavaScript.

192
00:11:00,530 --> 00:11:02,730
Dar puteți face, de asemenea, jQuery aici.

193
00:11:02,730 --> 00:11:06,200
>> Deci, să ne uităm la acest prim aspect aici.

194
00:11:06,200 --> 00:11:09,500
Vom crea o variabilă numit HTML, care este un șir.

195
00:11:09,500 --> 00:11:15,890
Ea are o etichetă paragraf în ea, asta se numește un text nou.

196
00:11:15,890 --> 00:11:19,420
Deci avem acest cod HTML, este un text nou, în tag-uri paragraf.

197
00:11:19,420 --> 00:11:21,800
Acum, am de fapt, doresc să-l adăugați la pagina.

198
00:11:21,800 --> 00:11:28,310
Am stabilit astfel încât HTML pentru prezentul alineat, această titlu aici, este de adăugare ID.

199
00:11:28,310 --> 00:11:32,320
Dacă vom selecta adăugați ID-ul și apoi adăugați-l la

200
00:11:32,320 --> 00:11:34,560
variabila HTML-am creat,

201
00:11:34,560 --> 00:11:40,370
se va adăuga că HTML la sfârșitul anului, imediat după acest tag-ul paragraf.

202
00:11:40,370 --> 00:11:43,730
Deci, dacă facem asta - am ales acest alineat,

203
00:11:43,730 --> 00:11:47,590
și am sunat la funcția de adăugare cu variabila HTML-am adăugat doar,

204
00:11:47,590 --> 00:11:50,960
se va adăuga că noul text chiar acolo, pe pagina.

205
00:11:50,960 --> 00:11:54,970
Putem adauge, de asemenea, ceea ce înseamnă că va merge înainte, la începutul acestui element.

206
00:11:54,970 --> 00:11:58,290
Deci, nu este un text nou de la început și după aceea.

207
00:11:58,290 --> 00:12:01,660
Eu pot merge mai departe și reîmprospăta pentru a scăpa de lucrurile astea eu doar am facut.

208
00:12:01,660 --> 00:12:05,280
Dar asta e un exemplu de modul în care puteți folosi pune prefix și adăugați metode

209
00:12:05,280 --> 00:12:08,910
pentru a manipula lucruri pe pagina, adăuga unele HTML.

210
00:12:08,910 --> 00:12:11,080
>> Puteți schimba, de asemenea, cursuri.

211
00:12:11,080 --> 00:12:14,970
Înapoi în acest dosar stil, am creat aceasta pentru clasa victorie

212
00:12:14,970 --> 00:12:19,990
care are roșu textul de culoare, unele de culoare de fundal, și o umbră de text.

213
00:12:19,990 --> 00:12:23,810
Se pare hidos, dar pot, de fapt -

214
00:12:23,810 --> 00:12:26,410
prezentul alineat corespunde cu ID-ul de clasă.

215
00:12:26,410 --> 00:12:29,860
Deci, eu pot adăuga clasa pentru victorie.

216
00:12:29,860 --> 00:12:31,870
Pot executa acest lucru în consolă,

217
00:12:31,870 --> 00:12:35,480
și că va adăuga această clasă, iar acum se pare hidos, cum era de așteptat.

218
00:12:35,480 --> 00:12:39,680
CSS automat se aplică la clasele pe care le -

219
00:12:39,680 --> 00:12:42,680
dacă există CSS pentru o clasă, se aplică automat

220
00:12:42,680 --> 00:12:44,680
dacă vă schimbați clasa a unui element.

221
00:12:44,680 --> 00:12:49,230
Atunci putem elimina doar prin clasa elimina.

222
00:12:49,230 --> 00:12:53,690
Deci, dacă aveți unele clase predefinite, cum ar fi rosu sau a subliniat,

223
00:12:53,690 --> 00:12:55,990
și apoi doriți să se aplice celor de elemente,

224
00:12:55,990 --> 00:12:58,230
nu trebuie să facă toate CSS fiecare dată.

225
00:12:58,230 --> 00:13:01,510
Puteți adăuga doar clasa de la un element, iar apoi acesta va deveni în mod automat -

226
00:13:01,510 --> 00:13:05,580
se va căuta în mod automat adecvat pentru această clasă.

227
00:13:05,580 --> 00:13:07,900
Putem elimina, de asemenea lucruri, așa că am de gând pentru a selecta toate divs

228
00:13:07,900 --> 00:13:10,830
pe pagina si a le elimina.

229
00:13:10,830 --> 00:13:13,990
Ce se că va arata?

230
00:13:13,990 --> 00:13:16,170
O să arate ca nimic, deci nu e de fapt nimic stânga.

231
00:13:16,170 --> 00:13:18,170
Prezentarea mea este plecat.

232
00:13:18,170 --> 00:13:21,290
Eu pot reîmprospăta și aduceți-l înapoi, din fericire,

233
00:13:21,290 --> 00:13:24,420
pentru că doar rulează o dată,

234
00:13:24,420 --> 00:13:29,460
dar asta e un exemplu de eliminare, dacă doriți pentru a distruge complet un element de pe pagină.

235
00:13:29,460 --> 00:13:33,180
>> Puteți suprascrie, de asemenea, și am de gând pentru a selecta toate etichetele alineat pe pagina

236
00:13:33,180 --> 00:13:36,850
și du-te în interiorul acestora și înlocui orice text pe care le au în ele

237
00:13:36,850 --> 00:13:39,690
cu doar cuvântul "de testare."

238
00:13:39,690 --> 00:13:46,520
Dacă faceți acest lucru, veți înlocui fiecare paragraf pe pagina cu această testare.

239
00:13:46,520 --> 00:13:49,150
Yep. Toate acestea sunt înlocuite cu testarea.

240
00:13:49,150 --> 00:13:53,270
Deci, asta e un exemplu de accesare a textului și de a suprascrie-l.

241
00:13:53,270 --> 00:13:57,490
Puteți prelua, de asemenea, informații, iar acest lucru este foarte misto pentru cutii de intrare.

242
00:13:57,490 --> 00:14:00,470
Dacă aveți o casetă de intrare care oamenii sunt tastarea lucruri în,

243
00:14:00,470 --> 00:14:03,880
oamenii sunt tastarea chestii în ea,

244
00:14:03,880 --> 00:14:09,030
aici vom selecta de intrare, orice etichetă de intrare, cu un tip de text.

245
00:14:09,030 --> 00:14:13,800
În acest caz, nu există decât o singură cutie de intrare în întreaga prezentare,

246
00:14:13,800 --> 00:14:17,260
asa ca vom alege doar primul, iar apoi vom apela funcția val pe ea.

247
00:14:17,260 --> 00:14:19,570
Care returnează o valoare, și pentru o caseta de intrare,

248
00:14:19,570 --> 00:14:24,330
valoarea este doar ceea ce se întâmplă să fie în interiorul acestuia.

249
00:14:24,330 --> 00:14:31,880
Deci, dacă am face acest lucru, ci doar întoarce lucrurile șir.

250
00:14:31,880 --> 00:14:36,860
Și dacă l-am numi din nou, după ce a scris mai multe lucruri, se transformă în mai multe lucruri.

251
00:14:36,860 --> 00:14:40,760
Aceasta este o modalitate foarte bună de a accesa elemente de o cutie de intrare, și apoi verificați,

252
00:14:40,760 --> 00:14:45,060
este aceasta o adresa de email valida, este aceasta o dată valabil, de exemplu.

253
00:14:45,060 --> 00:14:49,600
Puteți prelua doar lucruri instantaneu ca oamenii sunt de scris,

254
00:14:49,600 --> 00:14:54,830
și apoi verificați dacă este valabil, trimite-l inapoi la un server, face tot ce vrei cu ea.

255
00:14:54,830 --> 00:14:57,720
Și asta este modul în care accesați ce este în interiorul acestor cutii.

256
00:14:57,720 --> 00:15:00,090
>> De asemenea, puteți modifica CSS direct, astfel încât în ​​loc de a adăuga

257
00:15:00,090 --> 00:15:02,510
o clasă care are unele proprietăți predefinite,

258
00:15:02,510 --> 00:15:08,120
puteți adăuga doar ce CSS vrei sa ceva.

259
00:15:08,120 --> 00:15:10,350
Deci, haideți corp select, care este întreaga prezentare,

260
00:15:10,350 --> 00:15:14,370
și culoarea este proprietatea care definește ceea ce culori textul este.

261
00:15:14,370 --> 00:15:19,420
Dacă am schimba la rosu, tot textul din pagină se va transforma în roșu.

262
00:15:19,420 --> 00:15:26,310
Putem face ceva de genul fundal albastru culoare,

263
00:15:26,310 --> 00:15:30,680
acolo mergem, e frumos.

264
00:15:30,680 --> 00:15:33,840
Puteți face orice vrei cu asta.

265
00:15:33,840 --> 00:15:39,250
Folosind proprietatea CSS, puteți modifica cu adevărat modul în care ceva se uită la orice moment.

266
00:15:39,250 --> 00:15:41,630
Următorul lucru este efecte.

267
00:15:41,630 --> 00:15:45,710
Efectele sunt în esență același lucru ca și modificarea CSS,

268
00:15:45,710 --> 00:15:48,870
dar ele oferă de fapt o animație în plus să-l.

269
00:15:48,870 --> 00:15:53,380
Deci, în loc de doar arata sau ascunde ceva sau schimbarea culorii,

270
00:15:53,380 --> 00:15:56,130
puteți face de fapt animat.

271
00:15:56,130 --> 00:16:00,760
Iată documentația, dacă doriți să luați o privire la documentație extinsă pentru ea.

272
00:16:00,760 --> 00:16:04,760
Dar am de gând să acopere cele mai importante.

273
00:16:04,760 --> 00:16:12,030
Există afișa și a ascunde proprietăți.

274
00:16:12,030 --> 00:16:14,510
Arata / ascunde ID-ul de fapt corespunde la toată această casetă,

275
00:16:14,510 --> 00:16:18,190
Deci, dacă l-am ascuns, ea va dispărea pur și simplu.

276
00:16:18,190 --> 00:16:24,210
Și eu pot arăta din nou, dacă vreau să fac să vină înapoi.

277
00:16:24,210 --> 00:16:26,340
Și sa întors. Acesta nu a dispărut de fapt,

278
00:16:26,340 --> 00:16:30,670
Nu am de fapt, scoateți-l din pagina, am stabilit doar proprietatea CSS de vizibilitate a ascuns

279
00:16:30,670 --> 00:16:34,030
astfel încât să nu-l mai văd.

280
00:16:34,030 --> 00:16:39,250
Există, de asemenea, glisați în sus și glisați în jos, care vă permite să aibă acest efect.

281
00:16:39,250 --> 00:16:47,050
Alunecă până să dispară, iar după ce dispare

282
00:16:47,050 --> 00:16:53,210
aveți posibilitatea să glisați-l în jos pentru a face să vină înapoi. Și acum e înapoi.

283
00:16:53,210 --> 00:16:57,650
Există, de asemenea, acest efect se estompeze, care - ID decolorare corespunde această casetă.

284
00:16:57,650 --> 00:17:01,200
Dacă l-am dispărea, atunci va dispărea încet.

285
00:17:01,200 --> 00:17:04,490
Pot, de asemenea, se estompeze în, și ea va veni înapoi.

286
00:17:04,490 --> 00:17:08,930
Puteți face, de asemenea, se estompeze a, care este specific pentru funcția estompeze.

287
00:17:08,930 --> 00:17:12,589
Puteți să-l dispărea la orice opacitate specifice pe care le doriți.

288
00:17:12,589 --> 00:17:16,869
Deci, dacă se estompeze încet la 0.5, va deveni jumătate vizibil.

289
00:17:16,869 --> 00:17:22,630
Eu pot face să meargă la 0.1, și înapoi la 1 pentru a face pe deplin vizibil din nou.

290
00:17:22,630 --> 00:17:24,760
Asta e doar o animație pe care le puteți face.

291
00:17:24,760 --> 00:17:26,750
>> Există, de asemenea, efectele de comutare.

292
00:17:26,750 --> 00:17:33,410
Așa că am de gând pentru a selecta ID-ul de comutare, care corespunde la această casetă,

293
00:17:33,410 --> 00:17:38,970
și pe care div le puteți apela de comutare, în cazul în care este vizibil va deveni invizibil,

294
00:17:38,970 --> 00:17:42,320
daca e invizibil va deveni din nou vizibil.

295
00:17:42,320 --> 00:17:44,440
Așa că am sunat această funcție de comutare de două ori, prima a fost

296
00:17:44,440 --> 00:17:48,380
același lucru ca și pielea, al doilea apel a fost același lucru ca un spectacol.

297
00:17:48,380 --> 00:17:53,510
Și puteți face acest lucru cu o comutare decolorare,

298
00:17:53,510 --> 00:17:55,730
care face același lucru, doar că de fapt dispare.

299
00:17:55,730 --> 00:17:59,410
Și același lucru cu slide comuta.

300
00:17:59,410 --> 00:18:01,460
Există efecte înlănțuite, precum și, ceea ce înseamnă

301
00:18:01,460 --> 00:18:05,520
dacă selectați un element și numi doar o grămadă de metode de animație pe ea,

302
00:18:05,520 --> 00:18:07,400
dacă ai vrut să se estompeze, apoi glisați în jos,

303
00:18:07,400 --> 00:18:11,040
și apoi ascunde și apoi dispărea în, ea le va face într-un rând.

304
00:18:11,040 --> 00:18:24,920
Deci a dispărut, s-au întors - pentru un motiv oarecare, pielea nu sa întâmplat.

305
00:18:24,920 --> 00:18:30,030
Să-l încercați. Da, așa este stins și apoi a alunecat departe.

306
00:18:30,030 --> 00:18:32,230
Și există o mulțime mai mult. Puteți folosi funcția animate

307
00:18:32,230 --> 00:18:35,370
pentru a crea propriile animații, care este destul de complex,

308
00:18:35,370 --> 00:18:38,790
dar vă oferă cu extensibilitate infinit.

309
00:18:38,790 --> 00:18:40,630
Puteți face orice fel de animație pe care doriți.

310
00:18:40,630 --> 00:18:44,230
Puteți folosi, de asemenea coadă să stea la cozi mai multe animații la un moment dat.

311
00:18:44,230 --> 00:18:47,340
Deci, dacă vrei ceva pentru a acoperi întreaga pagină,

312
00:18:47,340 --> 00:18:49,860
cadru din dreapta sus la stânga jos, puteți face acest lucru,

313
00:18:49,860 --> 00:18:55,240
și au doar o grămadă de acțiuni care merg una după alta.

314
00:18:55,240 --> 00:18:57,490
>> Următorul lucru pe care am de gând să vorbesc despre este de evenimente.

315
00:18:57,490 --> 00:19:02,090
Evenimente vă permite - până acum, am fost doar tastând lucrurile în consolă

316
00:19:02,090 --> 00:19:04,870
și că este o modalitate de a face acest lucru,

317
00:19:04,870 --> 00:19:08,020
dar pe o pagină reală, nu vei fi capabil să

318
00:19:08,020 --> 00:19:10,020
face tip de lucruri de utilizator în consolă.

319
00:19:10,020 --> 00:19:12,050
Vrei ca lucrurile să se întâmple în mod automat.

320
00:19:12,050 --> 00:19:18,060
Pentru că, trebuie să utilizați evenimentele care activează pe un anumit eveniment se întâmplă.

321
00:19:18,060 --> 00:19:21,340
Puteți verifica documentația pentru detalii complete.

322
00:19:21,340 --> 00:19:24,030
Deci, haideți să vedem. Vrem pentru a ascunde sau a afișa caseta,

323
00:19:24,030 --> 00:19:29,340
dar acum acest buton nu face nimic pentru că nu am pune în aplicare încă.

324
00:19:29,340 --> 00:19:35,420
Am de gând să merg la pagina HTML real.

325
00:19:35,420 --> 00:19:38,560
Aici e diapozitiv. Există un div pentru diapozitiv.

326
00:19:38,560 --> 00:19:41,230
Ea are clasa de diapozitiv.

327
00:19:41,230 --> 00:19:46,890
Exista textul. Acum, există această casetă și butonul de box.

328
00:19:46,890 --> 00:19:52,900
Cum ne-ar face de fapt acest lucru sa dispara?

329
00:19:52,900 --> 00:19:58,250
Mai întâi de toate, haideți să scrie o funcție care face ID-ul cutie dispar.

330
00:19:58,250 --> 00:20:01,820
Aceasta este sintaxa pentru funtion, hai să hideTheBox sun.

331
00:20:01,820 --> 00:20:06,130
Aceasta nu ia nici un argument, pentru că nu există argumente să fie luate.

332
00:20:06,130 --> 00:20:08,950
Putem selecta ID caseta.

333
00:20:08,950 --> 00:20:15,020
Deci, folosind jQuery selectați, putem selecta ID cutie,

334
00:20:15,020 --> 00:20:17,700
și apoi chiar a face să dispară.

335
00:20:17,700 --> 00:20:20,690
Să fie fade out.

336
00:20:20,690 --> 00:20:27,390
Dacă am fugit această funcție în consola real,

337
00:20:27,390 --> 00:20:33,380
am putea defini această funcție, putem numi hideTheBox, și funcționează.

338
00:20:33,380 --> 00:20:36,650
Dar vrem să se întâmple atunci când butonul este apăsat, de fapt.

339
00:20:36,650 --> 00:20:40,950
Pentru a face acest lucru, trebuie să folosim un eveniment.

340
00:20:40,950 --> 00:20:45,500
Pentru a lega un eveniment la un buton specific sau ceva se întâmplă acțiune,

341
00:20:45,500 --> 00:20:50,040
avem de a selecta elementul care evenimentul se va declanșa -

342
00:20:50,040 --> 00:20:52,650
sau că va declanșa eveniment, îmi pare rău.

343
00:20:52,650 --> 00:20:57,220
>> Deci, în primul rând, să selectați butonul ID cutie

344
00:20:57,220 --> 00:20:59,610
pentru că e butonul, și acum, pentru că butonul,

345
00:20:59,610 --> 00:21:02,750
ne-o dorim pentru a crea o animație atunci când se face clic.

346
00:21:02,750 --> 00:21:05,040
Deci, există această funcție clic.

347
00:21:05,040 --> 00:21:08,470
Acesta vă permite de a lega o altă funcție de aceasta.

348
00:21:08,470 --> 00:21:12,320
Această funcție are altă funcție ca un argument

349
00:21:12,320 --> 00:21:14,310
putem trece în funcția hideTheBox,

350
00:21:14,310 --> 00:21:20,950
și ori de câte ori acest buton este apasat, ca functia va executa în mod automat.

351
00:21:20,950 --> 00:21:24,850
Deci, acest lucru va funcționa dacă vom salva, voi actualiza,

352
00:21:24,850 --> 00:21:33,460
și - o secundă, îmi pare rău.

353
00:21:33,460 --> 00:21:44,770
Să-mi repari asta foarte repede.

354
00:21:44,770 --> 00:21:50,680
Bine. Acolo mergem. Deci, acum caseta dispare atunci când faceți clic pe butonul.

355
00:21:50,680 --> 00:21:55,470
Putem schimba, de asemenea, acest lucru doar pentru a fadeToggle,

356
00:21:55,470 --> 00:22:00,020
schimba doar pentru a ascunde sau a afișa caseta,

357
00:22:00,020 --> 00:22:03,850
și acest lucru va lucra, de asemenea, de asemenea, dacă vom reîmprospăta.

358
00:22:03,850 --> 00:22:08,550
Ne putem ascunde, putem, de asemenea, arăta, și că va continua să lucreze.

359
00:22:08,550 --> 00:22:12,210
Un alt lucru pe care îl putem face este, nu avem de fapt, pentru a defini această funcție hideTheBox

360
00:22:12,210 --> 00:22:15,050
înainte de a apela funcția clic.

361
00:22:15,050 --> 00:22:17,640
Deci, în loc de definire a funcției și de asteptare hideTheBox,

362
00:22:17,640 --> 00:22:20,310
suntem doar de gând să-l sun dacă acest lucru se face clic.

363
00:22:20,310 --> 00:22:22,310
Deci, putem defini anonim aici,

364
00:22:22,310 --> 00:22:25,070
care este o caracteristică care are JavaScript.

365
00:22:25,070 --> 00:22:29,720
Puteți defini o funcție, în mod normal, ne-ar spune funcție hideTheBox

366
00:22:29,720 --> 00:22:34,490
cu argumente, dar în schimb, putem spune doar funcționa fără nici un argument,

367
00:22:34,490 --> 00:22:36,870
începe bretele cret pentru a defini funcția,

368
00:22:36,870 --> 00:22:40,780
aproape că bretele cret, iar apoi definiți funcția de aici,

369
00:22:40,780 --> 00:22:45,130
în prima paranteză și ultima paranteză

370
00:22:45,130 --> 00:22:47,860
care corespund la argumentele funcției clic.

371
00:22:47,860 --> 00:22:53,320
Deci, suntem trece în această funcție, putem copia această linie de cod chiar aici,

372
00:22:53,320 --> 00:22:55,450
și că va face exact acelasi lucru.

373
00:22:55,450 --> 00:22:57,290
Și acum nu avem această funcție fadeTheBox aleatorie

374
00:22:57,290 --> 00:22:59,960
care este ședinței în jurul valorii pentru nici un motiv aparent.

375
00:22:59,960 --> 00:23:02,070
Funcția a fost definit anonim, aceasta nu are un nume.

376
00:23:02,070 --> 00:23:08,060
Acesta va executa doar atunci când am clic pe butonul cutie.

377
00:23:08,060 --> 00:23:12,180
Deci răcoritoare o dată mai mult, o dată mai mult, și puteți vedea că încă mai funcționează.

378
00:23:12,180 --> 00:23:16,700
Și asta este modul în care creați evenimente.

379
00:23:16,700 --> 00:23:19,190
>> Există o mulțime de diferite evenimente pe care le putem folosi.

380
00:23:19,190 --> 00:23:23,540
Mă duc pentru a reveni la folosind consola de pe care tocmai ați arăta modul în care aceste lucru.

381
00:23:23,540 --> 00:23:28,210
ID-urile pentru fiecare dintre acestea corespund fiecare cutie.

382
00:23:28,210 --> 00:23:33,020
Deci, această casetă este să faceți clic ID-ul, acesta este ID-ul cheie, iar acesta este ID-ul mouse-ului.

383
00:23:33,020 --> 00:23:36,120
Un lucru mai mult este faptul că nu există această funcție acțiune, mai degrabă decât să tastați-l de fiecare dată,

384
00:23:36,120 --> 00:23:41,610
De fapt, am mers mai departe și a definit această funcție acțiune aici.

385
00:23:41,610 --> 00:23:46,860
Ea face același lucru ca și funcția hideTheBox.

386
00:23:46,860 --> 00:23:51,340
Ea devine această casetă și fie se stinge-l afară sau cade-l inch

387
00:23:51,340 --> 00:23:54,110
Și de aceea suntem capabili să-l folosească aici.

388
00:23:54,110 --> 00:24:00,350
Deci, dacă am faceți clic pe această faceți clic pe ID-ul, vrem să facem caseta dispar sau reapar.

389
00:24:00,350 --> 00:24:03,610
Este același lucru ca și butonul pe care am avut-o în ultimul diapozitiv.

390
00:24:03,610 --> 00:24:07,450
Acum, după ce numim, care, putem faceți clic pe aceasta și caseta va dispărea,

391
00:24:07,450 --> 00:24:10,160
apoi faceți clic pe el din nou și cutia va reaparea.

392
00:24:10,160 --> 00:24:12,480
Asta e destul de simplu. Dublu clic pe face același lucru,

393
00:24:12,480 --> 00:24:15,660
cu excepția este nevoie de un dublu clic.

394
00:24:15,660 --> 00:24:19,030
Deci, dacă faceți clic pe o dată și faceți clic pe acesta din nou, nimic nu se va întâmpla,

395
00:24:19,030 --> 00:24:21,140
dar dacă faceți dublu clic rapid, va dispărea.

396
00:24:21,140 --> 00:24:23,310
Dacă faceți dublu clic din nou, el va veni înapoi.

397
00:24:23,310 --> 00:24:25,250
Așa că e destul de simplu.

398
00:24:25,250 --> 00:24:31,170
Tastatură de intrare este un fel de ciudat, eu nu cred că de fapt funcționează în acest exemplu

399
00:24:31,170 --> 00:24:37,670
deoarece cheia în jos, în sus tasta și apăsați tasta și alte acțiuni-cheie

400
00:24:37,670 --> 00:24:47,190
activa indiferent de ceea ce elementul pe care-l leaga de.

401
00:24:47,190 --> 00:24:51,410
De exemplu, chiar dacă am legat cheia în jos pentru a corpului sau altceva complet,

402
00:24:51,410 --> 00:24:55,950
atunci s-ar activa în continuare, indiferent de - nu este specific.

403
00:24:55,950 --> 00:25:00,190
Nu trebuie să fie făcând clic pe acest și apăsați o tastă pentru a face nimic dispară.

404
00:25:00,190 --> 00:25:04,470
Ar fi activat, indiferent de ceea ce elementul Eu sunt în prezent inch

405
00:25:04,470 --> 00:25:06,880
Deci, acestea nu funcționează de fapt, în acest exemplu

406
00:25:06,880 --> 00:25:13,180
pentru că nu mă recunoaște ca intrarea de intrare în div tastatură.

407
00:25:13,180 --> 00:25:15,740
>> Dar daca te uiti la acțiunile mouse-ul,

408
00:25:15,740 --> 00:25:19,620
primul este plana, și se poate face o parte din aceasta folosind CSS.

409
00:25:19,620 --> 00:25:24,280
Dacă utilizați CSS, puteți crea, astfel că, dacă treceți peste ceva,

410
00:25:24,280 --> 00:25:28,940
apoi sale modificări de stil.

411
00:25:28,940 --> 00:25:32,170
Dar folosind jQuery puteți schimba stilurile de alte lucruri, de asemenea.

412
00:25:32,170 --> 00:25:37,120
Deci, de exemplu, vom apela acțiune dacă treceți peste această div.

413
00:25:37,120 --> 00:25:39,660
Asta înseamnă că dacă ne treceți peste ea, apoi caseta va dispărea.

414
00:25:39,660 --> 00:25:42,430
Dacă ne îndepărtăm de ea, caseta va reaparea.

415
00:25:42,430 --> 00:25:45,090
Dacă noi numim acest lucru și treceți peste el, caseta nu dispare,

416
00:25:45,090 --> 00:25:47,050
și de îndată ce ne îndepărtăm, vine înapoi.

417
00:25:47,050 --> 00:25:49,750
Dacă noi numim această funcție Hover pe ID-ul mouse-ului,

418
00:25:49,750 --> 00:25:54,380
care corespunde pentru această casetă, apoi, dacă am hover peste caseta,

419
00:25:54,380 --> 00:26:00,440
apoi caseta va disparea de fapt - el fiind funky, chiar acum, dar -

420
00:26:00,440 --> 00:26:06,310
dacă ne îndepărtăm de ea, ea va reapărea. Acum e invers pentru un motiv oarecare.

421
00:26:06,310 --> 00:26:12,720
Mouse-ul intra și funcțiile mutați mouse sunt oarecum similare, dar ușor diferit.

422
00:26:12,720 --> 00:26:16,470
Mouse-ul intra doar activeaza atunci cand mouse-ul intra in cutie, cum era de așteptat.

423
00:26:16,470 --> 00:26:19,210
Deci, dacă vă mutați în ea, ea va dispărea.

424
00:26:19,210 --> 00:26:23,210
Dar nu va reapare atunci când mutați departe, va trebui să se mute înapoi pe ea pentru ca aceasta să vină înapoi.

425
00:26:23,210 --> 00:26:25,590
Există, de asemenea, funcția de mișcare mouse-ul, care va activa

426
00:26:25,590 --> 00:26:29,300
ori de câte ori mouse-ul este chiar prezentă în cutie.

427
00:26:29,300 --> 00:26:32,430
Așa că va păstra doar pe merge, decolorare și în afară.

428
00:26:32,430 --> 00:26:35,660
Și este de fapt logare - se pare ca e doar decolorare și în afară,

429
00:26:35,660 --> 00:26:39,140
dar este de fapt logare mult mai multe acțiuni decât aceasta,

430
00:26:39,140 --> 00:26:43,550
Deci, atunci când vă îndepărtați-l va ține doar merge pentru că logat ca o mie de ei.

431
00:26:43,550 --> 00:26:46,620
Poate nu o mie. Poate cinci.

432
00:26:46,620 --> 00:26:50,200
Aceasta jurnalele de mai mult decât atât.

433
00:26:50,200 --> 00:26:53,280
Ideea este, toate acțiunile mouse-ul, există o mulțime de ei.

434
00:26:53,280 --> 00:26:55,480
Puteți citi pe celelalte, dar toate sunt ușor diferite,

435
00:26:55,480 --> 00:26:57,700
și puteți alege în funcție de care ai nevoie

436
00:26:57,700 --> 00:27:02,130
pentru oricare scop specific ce încerci să faci.

437
00:27:02,130 --> 00:27:05,060
>> Următorul lucru pe care am de gând să vorbesc despre este AJAX.

438
00:27:05,060 --> 00:27:09,340
AJAX, știu că nu am acoperi JavaScript în măsura în profunzime acest an,

439
00:27:09,340 --> 00:27:11,770
așa că eu sunt doar de gând să vorbesc despre AJAX, în general, pentru un minut.

440
00:27:11,770 --> 00:27:15,210
AJAX vine de la Asynchronous JavaScript și XML.

441
00:27:15,210 --> 00:27:19,030
Este practic, de exemplu, atunci cand esti pe Facebook și-l va impinge o notificare,

442
00:27:19,030 --> 00:27:23,060
asta pentru ca AJAX se execută pe browser-ul web.

443
00:27:23,060 --> 00:27:25,800
La fiecare două secunde, browser-ul web, de fapt,

444
00:27:25,800 --> 00:27:29,420
merge la serverele Facebook, cerându-le, ai ceva nou pentru mine,

445
00:27:29,420 --> 00:27:31,980
și apoi se întoarce la tine.

446
00:27:31,980 --> 00:27:36,320
Acest lucru vă permite să trimiteți cereri de la un server

447
00:27:36,320 --> 00:27:38,660
fără a avea de fapt pentru a încărca pagina.

448
00:27:38,660 --> 00:27:42,040
Deci, în mod normal, dacă sunteți doar folosind PHP și o bază de date,

449
00:27:42,040 --> 00:27:45,480
aveți pentru a reîmprospăta pagina înainte de a putea obține informații noi de la server.

450
00:27:45,480 --> 00:27:48,770
Dar folosind AJAX, puteți trage pentru că informații noi în mod constant,

451
00:27:48,770 --> 00:27:52,250
sau trage pentru el atunci când faceți clic pe un buton sau ceva de genul asta.

452
00:27:52,250 --> 00:27:56,140
Deci, acest lucru ne permite să trimiteți cereri fără a reîncărca pagina,

453
00:27:56,140 --> 00:27:58,130
și putem folosi fie GET sau POST cereri.

454
00:27:58,130 --> 00:28:05,370
>> Cererile GET sunt, de exemplu, dacă vă la Google.com

455
00:28:05,370 --> 00:28:10,900
și de a face q = test. Care-i da un test de interogare.

456
00:28:10,900 --> 00:28:15,890
Și că este o cerere Da, deoarece se trece în acești parametri în URL-ul în sine.

457
00:28:15,890 --> 00:28:19,250
O solicitare POST este ca daca esti le trimit prin poștă.

458
00:28:19,250 --> 00:28:22,500
E ca si cum l-ai pus într-o scrisoare și nava-l la ei,

459
00:28:22,500 --> 00:28:25,140
dar ei nu văd de fapt, conținutul. Ei nu sunt vizibile în adresa URL.

460
00:28:25,140 --> 00:28:31,040
Nu puteți să-l tastați direct în, trebuie să-l trimită aproape secret.

461
00:28:31,040 --> 00:28:33,880
Este într-un mesaj.

462
00:28:33,880 --> 00:28:38,660
Dar folosind jQuery, puteți face GET si POST cereri

463
00:28:38,660 --> 00:28:42,740
mult mai ușor decât în ​​mod normal, ai putea folosind doar JavaScript simplu.

464
00:28:42,740 --> 00:28:50,140
Puteți interoga API-uri folosind Cererile GET, și puteți verifica, de asemenea, pentru informațiile de conectare.

465
00:28:50,140 --> 00:28:54,400
Pe pagina următoare, am creat aceasta, care întreabă, "Ce e pentru masa de prânz?"

466
00:28:54,400 --> 00:28:58,230
folosind Harvard alimente API, asa ca hai sa trage asta.

467
00:28:58,230 --> 00:29:01,840
Acesta este doar un exemplu de modul în care puteți folosi jQuery pentru a face o cerere de a ajunge la un API

468
00:29:01,840 --> 00:29:04,200
și a obține informații înapoi la ea.

469
00:29:04,200 --> 00:29:07,090
Așa că vrem să vedem meniul pentru ziua de azi,

470
00:29:07,090 --> 00:29:10,560
și vrem să vedem ceea ce este pentru masa de prânz.

471
00:29:10,560 --> 00:29:16,500
Aici e URL-ul pentru a crea o cerere intra in jQuery.

472
00:29:16,500 --> 00:29:18,600
utilizați $. obține funcția.

473
00:29:18,600 --> 00:29:22,290
Primul argument este URL-ul, deci exact ceea ce interogarea.

474
00:29:22,290 --> 00:29:27,200
Apoi, următorul argument este o funcție care execută atunci când cererea GET este completă.

475
00:29:27,200 --> 00:29:29,980
Deci, va trimite pe unii cerere la server, așteptați pentru ca aceasta să vină înapoi.

476
00:29:29,980 --> 00:29:33,770
When it se întoarce, vei va lua ceva acțiune datele care înapoi la server.

477
00:29:33,770 --> 00:29:37,520
Să mergem mai departe și codul aceasta, de asemenea.

478
00:29:37,520 --> 00:29:42,110
Nu am codul asta, fie, în scop.

479
00:29:42,110 --> 00:29:46,660
Aici e TODO. Mai întâi de toate, haideți să utilizați obligatoriu eveniment

480
00:29:46,660 --> 00:29:50,820
astfel încât atunci când acest buton este apăsat, ne trimit o cerere GET.

481
00:29:50,820 --> 00:29:53,410
Și în momentul în care cererea GET întoarce cu unele date,

482
00:29:53,410 --> 00:29:57,290
am de gând să-l scrie în această masă informații ID-ul div.

483
00:29:57,290 --> 00:30:02,860
Mai întâi de toate, să selectați butonul ID alimente.

484
00:30:02,860 --> 00:30:07,320
Atunci când se face clic, vrem să facem ceva.

485
00:30:07,320 --> 00:30:11,930
Să fac o fuction anonim, la fel ca înainte.

486
00:30:11,930 --> 00:30:15,550
Poate încheia aceste acolade,

487
00:30:15,550 --> 00:30:18,530
și atunci când acest buton este apăsat, dorim să trimită o cerere Da

488
00:30:18,530 --> 00:30:20,750
pentru a verifica ceea ce este pentru masa de prânz.

489
00:30:20,750 --> 00:30:24,970
Pentru a face acest lucru, putem doar să tastați $. Obține.

490
00:30:24,970 --> 00:30:28,850
Aceasta este o funcție jQuery, folosind semnul $.

491
00:30:28,850 --> 00:30:31,430
Este nevoie de o pereche de argumente. Prima este URL-ul,

492
00:30:31,430 --> 00:30:34,450
al doilea este funcția de apel invers, funcție care se numește

493
00:30:34,450 --> 00:30:37,740
în momentul în care cererea se întoarce de fapt.

494
00:30:37,740 --> 00:30:39,890
Să construim doar URL-ul primul.

495
00:30:39,890 --> 00:30:44,650
O putem lua de la API că David a scris sus.

496
00:30:44,650 --> 00:30:51,360
Mergând aici, putem vedea că e food.cs50.net/api/1.3/menus,

497
00:30:51,360 --> 00:30:54,140
și atunci trebuie doar să treacă în numele parametrilor care le-ar dori.

498
00:30:54,140 --> 00:30:57,760
Deci parametrul 1 este valoarea 1.

499
00:30:57,760 --> 00:31:00,910
Se pare ca data standardul, începe data, implicit azi

500
00:31:00,910 --> 00:31:03,110
Dacă nu se introduce nimic, și data de sfârșit și implicite

501
00:31:03,910 --> 00:31:05,930
pentru ziua de azi, dacă nu introduceți nimic.

502
00:31:05,930 --> 00:31:10,790
Asta e ceea ce ne dorim. Vrem doar pentru a obține informații pentru ziua de azi.

503
00:31:10,790 --> 00:31:12,950
>> Vrem ca formatul să fie în JSON.

504
00:31:12,950 --> 00:31:15,570
Asta e doar arbitrar, se poate folosi orice formă pe care doriți.

505
00:31:15,570 --> 00:31:18,950
Puteți folosi CSV, dar JSON este JavaScript Object Notation.

506
00:31:18,950 --> 00:31:24,150
Este foarte usor de JavaScript pentru a înțelege ce înseamnă,

507
00:31:24,150 --> 00:31:27,110
și putem imprima mai ușor așa.

508
00:31:27,110 --> 00:31:30,490
Deci, haideți să-l solicita în JSON, și cererea de prânz hai.

509
00:31:30,490 --> 00:31:37,660
Deci, masa = masa de pranz. Doar pentru a scrie că URL-ul, ne întoarcem aici.

510
00:31:37,660 --> 00:31:41,290
Există meniuri. Primul parametru este de ieșire = JSON

511
00:31:41,290 --> 00:31:44,640
pentru că asta e ceea ce ne dorim, și să separați parametrii cu o "și."

512
00:31:44,640 --> 00:31:48,940
Al doilea parametru este - Nu-mi amintesc.

513
00:31:48,940 --> 00:31:52,170
Masa. Și vrem masa = masa de pranz.

514
00:31:52,170 --> 00:31:57,390
Puteți testa acest URL tastând-o în browser-ul dvs. și să-l.

515
00:31:57,390 --> 00:32:03,120
Acesta vă va oferi o ieșire. E doar o grămadă de lucruri care-i pentru masa de prânz.

516
00:32:03,120 --> 00:32:10,410
Este scris în acest format urât. Vrem să-l imprima pe pagina noastră într-un format mai bun.

517
00:32:10,410 --> 00:32:12,580
Deci, URL-ul este corect, acum trebuie doar să scrie o funcție

518
00:32:12,580 --> 00:32:18,300
pentru a apela înapoi, atunci când cererea este de succes.

519
00:32:18,300 --> 00:32:20,430
Această funcție va avea de fapt un argument. Acesta va fi de date.

520
00:32:20,430 --> 00:32:25,650
Date este ceea ce se întoarce de la cererea GET după ce cererea GET se face.

521
00:32:25,650 --> 00:32:28,860
Putem face acolade, aici vom scrie functia anonim

522
00:32:28,860 --> 00:32:33,900
care execută, folosind ca date atunci când vom obține informații înapoi.

523
00:32:33,900 --> 00:32:37,840
Astfel de date, atunci când am scris în această adresă URL,

524
00:32:37,840 --> 00:32:41,540
aceasta este ceea ce date va arata. O să fie în acest șir imens.

525
00:32:41,540 --> 00:32:48,610
Dar un lucru bun este, JavaScript poate analiza prin utilizarea funcției JSON.parse.

526
00:32:48,610 --> 00:32:54,950
Deci, haideți să creeze o nouă variabilă numită de date analiza.

527
00:32:54,950 --> 00:32:57,060
Și date analiza este o serie de obiecte.

528
00:32:57,060 --> 00:33:04,200
Fiecare obiect conține informații, cum ar fi - de asemenea, să aruncăm o privire.

529
00:33:04,200 --> 00:33:08,980
Ea are o data, o masă, categorie, reteta, toate aceste alte lucruri.

530
00:33:08,980 --> 00:33:10,860
Așa că hai so imprima numele pentru fiecare.

531
00:33:10,860 --> 00:33:13,790
Să repeta pe întreaga gamă de lucruri pe care le primim înapoi de la ea,

532
00:33:13,790 --> 00:33:17,570
și doar imprima fiecare - imprima numele fiecăruia.

533
00:33:17,570 --> 00:33:22,670
Acesta este un pentru buclă.

534
00:33:22,670 --> 00:33:26,030
>> JavaScript are această sintaxă util în cazul în care puteți crea o variabilă și buclă pe o matrice,

535
00:33:26,030 --> 00:33:30,150
și var eu este doar iterator, astfel încât în ​​loc de a avea de a face var i = 0,

536
00:33:30,150 --> 00:33:40,290
Am fost mai mică decât lungimea, i + +, puteți face doar var i în date parsate.

537
00:33:40,290 --> 00:33:47,060
În acest exemplu, datele parsate.Toate (i) va corespunde elementului curent

538
00:33:47,060 --> 00:33:49,850
de matrice, obiectul real.

539
00:33:49,850 --> 00:33:51,720
Și vrem să obțineți numele din ea.

540
00:33:51,720 --> 00:33:54,170
Deci, hai să facem nume.

541
00:33:54,170 --> 00:33:57,000
Și ultimul lucru este, vom avea din nou un jQuery.

542
00:33:57,000 --> 00:34:02,660
De fapt adauga la div, aceasta masa informații div care este în prezent gol.

543
00:34:02,660 --> 00:34:05,430
Deci, haideți să selectați asta.

544
00:34:05,430 --> 00:34:13,870
Vom folosi masa informații div ID-ul jQuery și selectați, sau informatii masa ID, îmi pare rău.

545
00:34:13,870 --> 00:34:16,580
Vrem să adăugați la acest lucru.

546
00:34:16,580 --> 00:34:21,030
Dacă am făcut testul, de exemplu, s-ar suprascrie doar de fiecare dată singur.

547
00:34:21,030 --> 00:34:29,190
Deci, putem adăuga pur și simplu acest lucru.

548
00:34:29,190 --> 00:34:31,889
Elementul curent în matrice, vom obține numele de ea,

549
00:34:31,889 --> 00:34:38,159
și vom adăuga la sfârșitul ID-ul info masa div.

550
00:34:38,159 --> 00:34:40,120
Și apoi doar pentru a face să arate mai curat,

551
00:34:40,120 --> 00:34:51,550
vom adăuga, de asemenea, un sfârșit de linie, astfel că nu e totul pe o singură linie.

552
00:34:51,550 --> 00:34:55,280
Deci, dacă totul merge bine, că ar trebui să fie bun la -

553
00:34:55,280 --> 00:34:57,220
În primul rând, ori de câte ori acest buton este apasat,

554
00:34:57,220 --> 00:35:00,070
se va trimite de pe o cerere a ajunge la această adresă URL.

555
00:35:00,070 --> 00:35:02,500
În cazul în care datele se întoarce de la ea, o voi analiza,

556
00:35:02,500 --> 00:35:06,950
transforma într-JSON, bucla peste tot array care reprezinta aceste date,

557
00:35:06,950 --> 00:35:10,310
și apoi adăugați numele și un sfârșit de linie

558
00:35:10,310 --> 00:35:16,500
pentru fiecare linie în această masă informatii ID, care a fost anterior gol.

559
00:35:16,500 --> 00:35:18,910
Deci, merge înapoi la această pagină, vom actualiza,

560
00:35:18,910 --> 00:35:23,690
clic, afla - nu funcționează. Asta e nefericit.

561
00:35:23,690 --> 00:35:25,830
Și acest lucru este în cazul în depanare vine inch

562
00:35:25,830 --> 00:35:30,070
Index.html, linia 1.

563
00:35:30,070 --> 00:35:57,210
E interesant.

564
00:35:57,210 --> 00:35:59,720
Bine, bine, mai degrabă decât petrece timp face acest lucru, eu sunt doar de gând să

565
00:35:59,720 --> 00:36:07,070
trageți în sus dosar făcut că am, care este versiunea finalizat.

566
00:36:07,070 --> 00:36:13,710
Nu sunt sigur în ce constă diferența, dar putem deschide doar asta în schimb.

567
00:36:13,710 --> 00:36:19,740
Și mergem la AJAX, iar acest lucru ar trebui să funcționeze corect.

568
00:36:19,740 --> 00:36:21,730
Asta este ceea ce a fost azi la prânz,

569
00:36:21,730 --> 00:36:24,870
în nici o ordine anume, cu citate din jurul ei, așa că nu e cea mai frumoasa.

570
00:36:24,870 --> 00:36:27,090
Dar, evident, dacă faci acest lucru pentru un proiect final,

571
00:36:27,090 --> 00:36:30,120
v-ar face să arate mai bine.

572
00:36:30,120 --> 00:36:32,530
Dar asta e doar un simplu exemplu de cum să faci cerere Da.

573
00:36:32,530 --> 00:36:34,580
Și dacă ne uităm la codul actual, bănuiesc, eu sunt destul de sigur

574
00:36:34,580 --> 00:36:39,690
este încă destul de mult la fel.

575
00:36:39,690 --> 00:37:04,990
Oh, am uitat să-l transforma într-un șir, care este.

576
00:37:04,990 --> 00:37:07,920
Nu, nu este încă de lucru. Indiferent, aici e codul actual, completat

577
00:37:07,920 --> 00:37:10,300
de ce acest lucru ar trebui să arate,

578
00:37:10,300 --> 00:37:16,400
și-l face același lucru ca ceea ce am pus în aplicare.

579
00:37:16,400 --> 00:37:22,760
Când faceți clic pe butonul, se foloseste GET JSON pentru a analiza datele în mod automat.

580
00:37:22,760 --> 00:37:29,190
Este nevoie de date înapoi la ea și buclele prin toată gama

581
00:37:29,190 --> 00:37:32,770
și imprimă - orice e pentru masa de prânz astăzi, numele de ea,

582
00:37:32,770 --> 00:37:38,020
și adaugă un sfârșit de linie după fiecare linie.

583
00:37:38,020 --> 00:37:41,100
Asta e modul în care utilizați funcția GET.

584
00:37:41,100 --> 00:37:44,040
>> Puteți folosi, de asemenea, POST, pe care nu am avut timp

585
00:37:44,040 --> 00:37:47,940
pentru a scrie un exemplu pentru ea, dar ne putem uita la documentația.

586
00:37:47,940 --> 00:37:53,220
Dacă te uiți la jquery.post,

587
00:37:53,220 --> 00:37:55,510
puteți vedea că este aproape același lucru.

588
00:37:55,510 --> 00:38:01,650
Ai un URL, dar în loc de a trece parametri folosind -

589
00:38:01,650 --> 00:38:03,990
doar punerea lor în șirul de URL-ul în sine,

590
00:38:03,990 --> 00:38:06,300
va trebui să treacă în această variabilă de date

591
00:38:06,300 --> 00:38:11,990
care este de fapt un tablou, un dicționar care hărți parametrii la valorile.

592
00:38:11,990 --> 00:38:17,690
Tu treci că în, și care le trimite în ajutorul unui POST.

593
00:38:17,690 --> 00:38:20,790
Și odată ce ați că, atunci puteți avea o funcție de succes

594
00:38:20,790 --> 00:38:23,930
care execută atunci când datele se întoarce.

595
00:38:23,930 --> 00:38:26,430
În caz contrar, e exact la fel. Deci, folosind POST,

596
00:38:26,430 --> 00:38:29,970
este posibil să doriți să utilizați POST, de exemplu, dacă aveți o formă de intrare

597
00:38:29,970 --> 00:38:35,780
te lasa oamenii parole de intrare în ea, și trimite aceste parole pe

598
00:38:35,780 --> 00:38:41,850
pentru a script-ul de back-end, pentru a verifica în baza de date dacă acel utilizator este valid sau nu.

599
00:38:41,850 --> 00:38:46,700
Puteți face că tot cu ajutorul jQuery în loc de a avea pentru a actualiza pagina, la toate.

600
00:38:46,700 --> 00:38:52,160
Asta e modul în care am implementat în blog-ul pe care v-am arătat mai devreme.

601
00:38:52,160 --> 00:38:59,530
Dacă vom merge la portalul final și să ieșiți, log out,

602
00:38:59,530 --> 00:39:02,600
Log out nu funcționează.

603
00:39:02,600 --> 00:39:13,360
Ei bine, lăsați-mă să deschideți-l într-o fereastră nouă.

604
00:39:13,360 --> 00:39:16,580
Aici există o parolă, și am fost de gând să tastați în ceva aleatoriu.

605
00:39:16,580 --> 00:39:18,590
Ea nu funcționează, dar puteți vedea că nu am făcut

606
00:39:18,590 --> 00:39:20,840
de fapt, pentru a actualiza pagina, la toate.

607
00:39:20,840 --> 00:39:24,610
Codul, dacă vrei să te uiți la ea,

608
00:39:24,610 --> 00:39:37,460
toate acestea sunt disponibile aici.

609
00:39:37,460 --> 00:39:45,680
Deci, codul am scris anul trecut cândva.

610
00:39:45,680 --> 00:39:47,790
După cum puteți vedea aici, vom trimite o cerere POST.

611
00:39:47,790 --> 00:39:50,400
Am un fișier numit login.php în partea din spate,

612
00:39:50,400 --> 00:39:53,860
care verifică dacă parola este valabil.

613
00:39:53,860 --> 00:39:56,000
Parametrii trecem la o parolă, mapate la

614
00:39:56,000 --> 00:40:00,030
de intrare care este în această casetă de intrare în prezent.

615
00:40:00,030 --> 00:40:04,110
Și atunci când datele se întoarce, vom verifica.

616
00:40:04,110 --> 00:40:07,680
În cazul în care datele este falsă, atunci spunem parolă incorectă, glisați în jos,

617
00:40:07,680 --> 00:40:09,580
și chiar face să dispară după aceea.

618
00:40:09,580 --> 00:40:12,320
În caz contrar, vom încărca pagina de admin.

619
00:40:12,320 --> 00:40:15,080
Și acest lucru a fost făcut cu ajutorul JSON.

620
00:40:15,080 --> 00:40:18,510
În această multe linii de cod, se poate trece doar datele la capătul din spate,

621
00:40:18,510 --> 00:40:21,020
verificați dacă este corect, verificați dacă ați conectat în mod corect,

622
00:40:21,020 --> 00:40:24,200
și de fapt, răspunde la ea, redirecționarea persoana la pagina corectă

623
00:40:24,200 --> 00:40:29,760
sau nu permițându-le să vă autentificați și spunându-le că au o parolă incorectă.

624
00:40:29,760 --> 00:40:33,040
Deci, asta e un exemplu de cum ai putea folosi POST jQuery

625
00:40:33,040 --> 00:40:37,010
pentru a trimite o cerere POST pentru partea ta din spate,

626
00:40:37,010 --> 00:40:42,400
verificarea dacă cineva a conectat corect.

627
00:40:42,400 --> 00:40:44,820
>> În regulă, deci asta e tot exemplele le-am avut, și toate lucrurile pe care am vrut să le acopere.

628
00:40:44,820 --> 00:40:47,110
Acestea sunt cele mai importante lucruri pe care jQuery vă permite să faceți:

629
00:40:47,110 --> 00:40:52,640
selectați elemente, modifica-le folosind DOM manipulare,

630
00:40:52,640 --> 00:40:56,340
Puteți adăuga efecte, activa lucrurile pe anumite evenimente,

631
00:40:56,340 --> 00:41:00,430
și de a face, de asemenea, cereri AJAX, foarte perfect și ușor.

632
00:41:00,430 --> 00:41:02,840
Deci, vă mulțumesc că ați venit sau vizionarea,

633
00:41:02,840 --> 00:41:06,230
și dacă aveți orice întrebări, doar să-mi spuneți. Da?

634
00:41:06,230 --> 00:41:12,730
[Student] Înapoi atunci ai arătat, ai avut JSON după solicitarea POST în ghilimele,

635
00:41:12,730 --> 00:41:15,170
și mă întrebam despre ce a făcut.

636
00:41:15,170 --> 00:41:20,070
>> Da, văd. Întrebarea a fost că, în exemplul am arătat,

637
00:41:20,070 --> 00:41:25,790
acolo a fost JSON cuvântul în ghilimele -

638
00:41:25,790 --> 00:41:31,690
Voi trage doar l din nou - în jurul funcției de POST.

639
00:41:31,690 --> 00:41:43,320
Eu doar l trăgând în sus pentru a arăta.

640
00:41:43,320 --> 00:41:46,890
Deci, aici e solicitare POST, și nu există acest JSON în ghilimele.

641
00:41:46,890 --> 00:41:50,280
Asta doar definește ceea ce ne asteptam de ieșire să fie.

642
00:41:50,280 --> 00:41:54,070
Deci, dacă am întâmpla în JSON ca tipul de date,

643
00:41:54,070 --> 00:41:56,070
nu este o cerință, dar dacă am trece la,

644
00:41:56,070 --> 00:41:58,590
apoi datele vor fi analizat în mod automat ca JSON.

645
00:41:58,590 --> 00:42:00,600
Deci, noi nu trebuie să apela funcția parse JSON pe ea,

646
00:42:00,600 --> 00:42:02,620
se va întâmpla doar în mod automat.

647
00:42:02,620 --> 00:42:05,150
Și, dacă aruncăm o privire la documentația pentru POST,

648
00:42:05,150 --> 00:42:09,850
nu există acest tip de date variabile, tipul de date așteptate de la serverul.

649
00:42:09,850 --> 00:42:12,660
Implicit este o presupunere inteligent care poate fi greșit,

650
00:42:12,660 --> 00:42:15,520
astfel încât să puteți lăsa gol, dar e doar tipul de date

651
00:42:15,520 --> 00:42:21,680
în codificare pe care îl utilizați, fie că este vorba JSON sau XML sau altceva.

652
00:42:21,680 --> 00:42:25,280
>> Orice alte întrebări?

653
00:42:25,280 --> 00:42:27,300
Bine. Dacă aveți orice alte întrebări, nu ezitați să mi e-mail

654
00:42:27,300 --> 00:42:30,830
la vshekhawat@college.harvard.edu,

655
00:42:30,830 --> 00:42:34,860
și diapozitive și cod ar trebui să fie disponibile on-line destul de repede.

656
00:42:34,860 --> 00:42:42,810
Mult noroc cu proiectele finale, sper să folosiți jQuery.

657
00:42:42,810 --> 00:42:46,810
[CS50.TV]