1
00:00:00,000 --> 00:00:04,439

2
00:00:04,439 --> 00:00:07,230
Doug LLOYD: F'dan il-video, ridna
li jgħajtu attenzjoni separata

3
00:00:07,230 --> 00:00:09,110
għal ħafna partikolari
element tad JavaScript

4
00:00:09,110 --> 00:00:11,350
li inti tista 'ssib handy
meta int tibda

5
00:00:11,350 --> 00:00:15,750
biex jaħdmu fuq manipulazzjoni paġni web u
tibdil fil-kontenut tal-paġna web tiegħek

6
00:00:15,750 --> 00:00:16,460
fuq il-fly.

7
00:00:16,460 --> 00:00:19,450
U dak l-kunċett ta '
l-Mudell Għan Dokument.

8
00:00:19,450 --> 00:00:23,030
Allura kif rajna fil-video tagħna fuq
JavaScript, oġġetti huma flessibbli ħafna.

9
00:00:23,030 --> 00:00:24,750
>> U jistgħu jkun fihom diversi oqsma.

10
00:00:24,750 --> 00:00:28,075
U jekk aħna ma jmorru fil-lott ta '
dettall, f'dawk l-oqsma jew il-proprjetajiet,

11
00:00:28,075 --> 00:00:30,200
li nixtiequ probabbilment aktar
xieraq jsejħulhom

12
00:00:30,200 --> 00:00:33,915
fil-kuntest ta 'oġġett, anke
dawk il-proprjetajiet jistgħu jkunu oġġetti oħra.

13
00:00:33,915 --> 00:00:36,210
U ġewwa ta 'dawk l-oġġetti
jista 'jkun oġġetti oħra.

14
00:00:36,210 --> 00:00:39,630
>> Inti għandek dan l-oġġett kbir ħafna
ma 'lott ta' oġġetti oħra

15
00:00:39,630 --> 00:00:43,550
ġewwa ta 'dan, li tip ta'
toħloq din l-idea ta 'siġra kbira.

16
00:00:43,550 --> 00:00:47,540
Issa, id-dokument oġġett huwa
oġġett speċjali ħafna fil JavaScript

17
00:00:47,540 --> 00:00:52,580
li torganizza web kollu tiegħek
paġna taħt dan it-tip ta 'umbrella

18
00:00:52,580 --> 00:00:53,470
ta 'oġġett.

19
00:00:53,470 --> 00:00:56,770
U għalhekk ġewwa tad-dokument
oġġett huma oġġetti li jippreżentaw

20
00:00:56,770 --> 00:00:59,630
il-kap u l-korp tal-paġna web tiegħek.

21
00:00:59,630 --> 00:01:03,760
>> Ġewwa ta 'dawn huma l-oħra
oġġetti, eċċetera, eċċetera,

22
00:01:03,760 --> 00:01:08,411
sakemm page tiegħek web kollu għandu
ġew organizzati dan l-oġġett big.

23
00:01:08,411 --> 00:01:09,660
X'hemm-rasu hawn, id-dritt?

24
00:01:09,660 --> 00:01:12,170
Well, nafu kif taħdem
ma 'oġġetti fil JavaScript.

25
00:01:12,170 --> 00:01:15,840
>> Mela jekk ikollna oġġett li
tirreferi għall-paġna tagħna web kollu, li

26
00:01:15,840 --> 00:01:19,590
ifisser billi ċċempel il korretta
metodi li jimmanipulaw dak l-oġġett

27
00:01:19,590 --> 00:01:22,360
jew timmodifika ċerti
tal-proprjetajiet tiegħu, aħna

28
00:01:22,360 --> 00:01:25,500
tista 'tibdel l-elementi ta
paġna tagħna programmatically

29
00:01:25,500 --> 00:01:30,210
użu JavaScript minflok li
għall-kodiċi affarijiet ma, ngħidu aħna, HTML.

30
00:01:30,210 --> 00:01:33,760
Allura hawnhekk eżempju ta '
sempliċi ħafna web page, right?

31
00:01:33,760 --> 00:01:35,850
Huwa ltqajna tags HTML, ras.

32
00:01:35,850 --> 00:01:37,979
>> Ġewwa ta hemm titolu, bonjour dinja.

33
00:01:37,979 --> 00:01:38,770
Imbagħad I jkollhom korp.

34
00:01:38,770 --> 00:01:40,686
Ġewwa dan, għandi
tliet affarijiet differenti.

35
00:01:40,686 --> 00:01:44,170
I jkollhom tikketta header h2,
paragrafu, u rabta.

36
00:01:44,170 --> 00:01:45,920
Din hija paġna web sempliċi ħafna.

37
00:01:45,920 --> 00:01:48,590
>> Ukoll, dak id-dokument jista
toġġezzjona għal dan look like?

38
00:01:48,590 --> 00:01:50,700
Ukoll, huwa ftit
scary forsi fl-ewwel.

39
00:01:50,700 --> 00:01:52,510
Imma huwa verament ftit siġra kbira.

40
00:01:52,510 --> 00:01:54,890
U fl-għerq ħafna ta 'dan huwa dokument.

41
00:01:54,890 --> 00:02:00,030
>> Ġewwa tad-dokument hija ieħor
oġġett li jirreferu għall-HTML tal-paġna tiegħi.

42
00:02:00,030 --> 00:02:02,660
U l-HTML tal-paġna tiegħi hija kollha ta 'dan.

43
00:02:02,660 --> 00:02:06,900
U allura l ġewwa tal-HTML
oġġett, I jkollhom oġġett ras,

44
00:02:06,900 --> 00:02:09,000
li jirreferi għall kollox hemm.

45
00:02:09,000 --> 00:02:11,009
>> U ġewwa minnhom hemm,
I jkollhom oġġett titolu.

46
00:02:11,009 --> 00:02:15,620
U ġewwa minnhom hemm, I jkollhom ieħor
joġġezzjonaw li jinsab biss bonjour dinja.

47
00:02:15,620 --> 00:02:18,020
I jista 'jkollhom korp tiegħi
rappreżentata bħal dan.

48
00:02:18,020 --> 00:02:22,850
>> Ġewwa tal-ġisem tiegħi, I jkollhom h2
oġġett u oġġett p minflok il-paragrafu

49
00:02:22,850 --> 00:02:25,270
u oġġett ta 'rabta.

50
00:02:25,270 --> 00:02:29,660
U hekk dan ġerarkija kollha
jistax jiġi rappreżentat bħala siġra big

51
00:02:29,660 --> 00:02:31,990
ma 'lottijiet ta ftit iżgħar
affarijiet li joħorġu minnha.

52
00:02:31,990 --> 00:02:33,740
Issa, naturalment, meta
aħna qed programmazzjoni, aħna

53
00:02:33,740 --> 00:02:35,560
ma naħsibx ta 'affarijiet bħal siġra kbira.

54
00:02:35,560 --> 00:02:37,980
Irridu naraw reali
Kodiċi affarijiet relatati.

55
00:02:37,980 --> 00:02:40,790
>> U fortunatament, nistgħu
jużaw għodod iżviluppatur tagħna

56
00:02:40,790 --> 00:02:46,080
li attwalment tagħti ħarsa lejn
oġġett dokument din il-websajt tal.

57
00:02:46,080 --> 00:02:48,150
U ejja tagħmel dan.

58
00:02:48,150 --> 00:02:49,580
Hekk stajt fetħet tab browser.

59
00:02:49,580 --> 00:02:51,540
>> U stajt fetħet Developer Tools.

60
00:02:51,540 --> 00:02:54,460
U fil video tiegħi fuq JavaScript, I
semma li l-console mhuwiex

61
00:02:54,460 --> 00:02:56,770
someplace biss fejn
aħna istampar informazzjoni,

62
00:02:56,770 --> 00:02:59,560
huwa wkoll post fejn
nistgħu informazzjoni input.

63
00:02:59,560 --> 00:03:01,380
F'dan il-kuntest, dak li
Jien se ngħid huwa

64
00:03:01,380 --> 00:03:05,720
Nixtieq li terġa 'lura
id-dokument oġġetti,

65
00:03:05,720 --> 00:03:07,502
so I tista 'tibda li jkollhom ħarsa lejn din.

66
00:03:07,502 --> 00:03:08,460
Allura kif tista 'nagħmel dan?

67
00:03:08,460 --> 00:03:10,740
Ukoll, jekk irrid
jorganizzawh verament nicely,

68
00:03:10,740 --> 00:03:16,317
Jien se ngħid console.dir, D-I-R.
Issa, I-użu console.log għal ftit print

69
00:03:16,317 --> 00:03:17,400
xi ħaġa sempliċi ħafna.

70
00:03:17,400 --> 00:03:20,450
Imma jekk irrid li jorganizzaw dan
ġerarkikament bħal oġġett,

71
00:03:20,450 --> 00:03:23,800
Irrid tip ta 'struttura
bħal struttura direttorju.

72
00:03:23,800 --> 00:03:27,400
>> So I jridu console.dir dokument.

73
00:03:27,400 --> 00:03:28,430
Jien ser hit Ikteb.

74
00:03:28,430 --> 00:03:32,350
U d-dritt taħtha issa,
u jien ser zoom fil hawn,

75
00:03:32,350 --> 00:03:36,000
Stajt ltqajna dan id-dokument rispons
bi vleġġa ftit li jmiss lilu.

76
00:03:36,000 --> 00:03:39,470
Issa, meta I miftuħa dan vleġġa,
hemm għaddej li jkun hemm ħafna ta 'għalf.

77
00:03:39,470 --> 00:03:42,560
>> Iżda aħna qed tmur biex jinjoraw ħafna
ta 'dan u biss tip ta' fokus

78
00:03:42,560 --> 00:03:46,250
fuq l-aktar parti importanti, hekk aħna
tista 'tibda biex jinnaviga dan id-dokument.

79
00:03:46,250 --> 00:03:50,125
Hemm ħafna aktar għall-DOM minn
biss lymph nodes u tfal ġenitur.

80
00:03:50,125 --> 00:03:51,500
Hemm ħafna ta 'għalf anċillari.

81
00:03:51,500 --> 00:03:52,280
>> Hekk jien ser tiftaħ dan up.

82
00:03:52,280 --> 00:03:54,610
U hemm lott kollu
ta 'għalf li pops up.

83
00:03:54,610 --> 00:03:59,000
Iżda kollha I kura dwar huwa
dritt hawn, lymph tfal.

84
00:03:59,000 --> 00:04:00,410
Ejja miftuħa li sa.

85
00:04:00,410 --> 00:04:03,810
>> Ġewwa tal hemm nara
xi ħaġa familjari, HTML.

86
00:04:03,810 --> 00:04:07,670
Allura ġewwa tad-dokument tagħna
livell wieħed isfel, HTML.

87
00:04:07,670 --> 00:04:08,550
I miftuħa li sa.

88
00:04:08,550 --> 00:04:10,380
X'qed nistennew?

89
00:04:10,380 --> 00:04:13,760
>> Jekk inti recall minn dijagramma tagħna,
dak li għandu insibu ġewwa tal HTML?

90
00:04:13,760 --> 00:04:17,275
Liema tnejn lymph huma taħtha fil-siġra?

91
00:04:17,275 --> 00:04:17,899
Ejja issir taf.

92
00:04:17,899 --> 00:04:18,940
Aħna jiftħu HTML.

93
00:04:18,940 --> 00:04:22,079
Aħna jinżlu għal lymph tfal tagħha.

94
00:04:22,079 --> 00:04:23,440
>> Pop miftuħa.

95
00:04:23,440 --> 00:04:25,990
Hemm ras u l-ġisem.

96
00:04:25,990 --> 00:04:28,540
U aħna tista 'tiftaħ il-kap.

97
00:04:28,540 --> 00:04:30,460
Mur fil lymph tfal tagħha.

98
00:04:30,460 --> 00:04:31,460
Ukoll, hemm it-titolu.

99
00:04:31,460 --> 00:04:33,293
>> U aħna tista 'tmur fuq u
fuq bħal dan għal dejjem.

100
00:04:33,293 --> 00:04:34,770
Stajna nagħmlu dan mal-ġisem kif ukoll.

101
00:04:34,770 --> 00:04:40,090
Iżda hemm mod għalina biex tħares lejn
id-dokument organizzat bħala oġġett kbir.

102
00:04:40,090 --> 00:04:42,610
U jekk inħarsu lejn huwa kbir
oġġett li jistenna ħafna

103
00:04:42,610 --> 00:04:47,480
bħal kodiċi, dan ifisser li aħna tista 'tibda
biex jimmanipulaw dan l-oġġett big użu

104
00:04:47,480 --> 00:04:51,220
kodiċi għall-bidla dak tagħna
website jistenna u jħoss simili.

105
00:04:51,220 --> 00:04:54,920
>> Allura dak għodda pretty qawwija
għandna għad-dispożizzjoni tagħna issa.

106
00:04:54,920 --> 00:04:57,360
Allura kif aħna biss raw, il-
dokument oġġett innifsu

107
00:04:57,360 --> 00:05:01,392
u kollha ta 'l-oġġetti ġewwa ta' dan
għandhom proprjetajiet u l-metodi, just

108
00:05:01,392 --> 00:05:04,100
bħal kull oġġett ieħor li konna
ilha taħdem magħhom JavaScript.

109
00:05:04,100 --> 00:05:08,370
Iżda nistgħu nużaw dawk il-proprjetajiet u
jużaw dawn il-metodi biex tip ta 'drill stabbiliti

110
00:05:08,370 --> 00:05:10,900
mid-dokument kbar u jiksbu
iktar baxxi u aktar baxxa,

111
00:05:10,900 --> 00:05:13,360
ifjen u ifjen qmuħ
ta 'dettall, sakemm aħna

112
00:05:13,360 --> 00:05:17,510
nikseb għal biċċa speċifika ħafna ta 'tagħna
web page li aħna trid tibdel.

113
00:05:17,510 --> 00:05:22,700
>> U meta aħna aġġornament proprjetajiet tal-
Dokument Object jew sejħa dawn il-metodi,

114
00:05:22,700 --> 00:05:24,450
affarijiet jista 'jiġri fuq il-paġna web tagħna.

115
00:05:24,450 --> 00:05:28,420
U aħna ma bżonn tagħmel xi iġjeniċi
li jkollhom dawk il-bidliet jidħlu fis-seħħ.

116
00:05:28,420 --> 00:05:33,160
>> U li l-kapaċità pretty jibred biex
jkollhom meta aħna qed jaħdmu ma 'kodiċi.

117
00:05:33,160 --> 00:05:37,185
Allura dak li huma wħud mill dawn il-proprjetajiet
li huma parti minn dokument oġġett?

118
00:05:37,185 --> 00:05:40,100
Well, inti probabilment raw
ftit minnhom verament malajr

119
00:05:40,100 --> 00:05:42,700
kif konna iżżippjar
permezz tal--dokument ġgant

120
00:05:42,700 --> 00:05:45,150
oġġett aħna biss raw fil-web browser.

121
00:05:45,150 --> 00:05:48,420
>> Iżda ftit dawn il-proprjetajiet
Jista 'jkun affarijiet simili HTML ġewwa.

122
00:05:48,420 --> 00:05:52,950
U inti tista 'anki recall me
jużaw din fil-video JavaScript

123
00:05:52,950 --> 00:05:54,950
fl-aħħar nett meta I
kien jitkellem dwar avvenimenti.

124
00:05:54,950 --> 00:05:56,125
Liema kien dan HTML ġewwa?

125
00:05:56,125 --> 00:05:59,030
Ukoll, huwa biss x'hemm
fl bejn il-tags.

126
00:05:59,030 --> 00:06:01,590
>> U għalhekk l-HTML ġewwa,
per eżempju, tat-titolu

127
00:06:01,590 --> 00:06:05,390
tag, jekk kellna jinżammu għaddejjin fil
li eżempju mument ilu,

128
00:06:05,390 --> 00:06:08,020
kien ikun bonjour dinja.

129
00:06:08,020 --> 00:06:10,140
Dan kien it-titolu tal-paġna tagħna.

130
00:06:10,140 --> 00:06:12,370
Proprjetajiet oħra
jinkludi l-isem node, li

131
00:06:12,370 --> 00:06:15,810
huwa l-isem ta 'HTML
element bħal titolu.

132
00:06:15,810 --> 00:06:19,100
ID, li hija l-ID
jattribwixxu ta 'element HTML.

133
00:06:19,100 --> 00:06:23,790
>> Ifakkar li nistgħu jindikaw apposta
elementi speċifiċi tad HTML tagħna

134
00:06:23,790 --> 00:06:27,510
ma 'attribut ID, li normalment
taqa 'fil handy fil-kuntest ta' CSS,

135
00:06:27,510 --> 00:06:29,000
speċifikament.

136
00:06:29,000 --> 00:06:33,217
Node ġenitur, li hija referenza għal
x'hemm biss up fuq lili fil-DOM.

137
00:06:33,217 --> 00:06:35,800
U l-lymph tfal, li hija
referenza għall x'hemm stabbiliti hawn taħt lili.

138
00:06:35,800 --> 00:06:37,950
U rajna ħafna ta 'dak
biss tħares permezz.

139
00:06:37,950 --> 00:06:42,970
Lymph tfal, li kif sirna
iktar baxxi fil-siġra.

140
00:06:42,970 --> 00:06:46,590
>> Attributi, li jinsab biss firxa
tal attributi tal-element HTML.

141
00:06:46,590 --> 00:06:50,270
Allura eżempju ta 'attributi jista
jkun jekk għandek tag immaġni,

142
00:06:50,270 --> 00:06:54,090
dan normalment ikollu attribut sors,
forsi għoli u attribut wisa.

143
00:06:54,090 --> 00:06:57,120
U għalhekk li jkun biss firxa
ta 'kollha tal-attributi assoċjati

144
00:06:57,120 --> 00:06:59,300
ma 'dak l-element HTML.

145
00:06:59,300 --> 00:07:04,140
>> Style hija waħda oħra li
ma jirrappreżentaw il-CSS

146
00:07:04,140 --> 00:07:06,050
grafika ta 'element partikolari.

147
00:07:06,050 --> 00:07:08,310
U aktar tard f'dan
video, aħna ser speċifikament

148
00:07:08,310 --> 00:07:14,592
stil lieva biex jagħmlu koppja
ta 'bidliet websajt tagħna.

149
00:07:14,592 --> 00:07:15,800
Għalhekk dawn huma xi proprjetajiet.

150
00:07:15,800 --> 00:07:17,591
>> U hemm ukoll xi
metodi li nistgħu

151
00:07:17,591 --> 00:07:22,450
użu li wkoll aktar malajr forsi iżolat
elementi tal-Għan Dokument.

152
00:07:22,450 --> 00:07:26,730
Forsi, l-aktar versatili
li dawn ikunu getElementById.

153
00:07:26,730 --> 00:07:31,190
So I jista 'jgħid xi ħaġa simili, għaliex
ftakar huwa metodu tad-Dokument

154
00:07:31,190 --> 00:07:34,880
Joġġezzjonaw, document.getElementById.

155
00:07:34,880 --> 00:07:39,820
>> U ġewwa minn dawk parentesi, speċifika
element HTML ma ID partikolari

156
00:07:39,820 --> 00:07:42,330
attribut li stajt qabel
stabbiliti, u jien ser immedjatament

157
00:07:42,330 --> 00:07:46,685
mur dritt f'dak l-element
tal-websajt globali.

158
00:07:46,685 --> 00:07:49,310
So I ma jkollhom forsi iħaffer
down permezz ta 'kull saff wieħed.

159
00:07:49,310 --> 00:07:52,841
I tista 'biss tuża dan il-metodu li jsibuha,
tip simili jfittxu sħana missili,

160
00:07:52,841 --> 00:07:53,340
id-dritt?

161
00:07:53,340 --> 00:07:56,300
Hija biss tmur u ssib
eżattament dak huwa tfittex.

162
00:07:56,300 --> 00:07:59,290
>> GetElementsByTagName hija
simili ħafna fl-ispirtu.

163
00:07:59,290 --> 00:08:02,500
Forsi dan se ssib kollha ta 'l-
tags kuraġġużi jew kollha tal-lametti tal p

164
00:08:02,500 --> 00:08:05,920
u jagħtu me firxa ta 'kollox
li I jistgħu mbagħad jaħdmu ma '.

165
00:08:05,920 --> 00:08:12,080
appendChild żżid xi ħaġa
livell wieħed fl-siġra.

166
00:08:12,080 --> 00:08:16,440
>> So I tista 'żżid ġdid kollu
element livell wieħed aktar baxx.

167
00:08:16,440 --> 00:08:19,700
Jew I tista 'tneħħi element li l-
wieħed livell aktar baxx kif ukoll jekk irrid

168
00:08:19,700 --> 00:08:22,870
li tħassar xi ħaġa minn paġna tal-web tiegħi.

169
00:08:22,870 --> 00:08:28,480
Issa, nota kodifikazzjoni Veloċi u ta 'malajr
uġigħ ta 'ras iffrankar nota, nisperaw.

170
00:08:28,480 --> 00:08:31,670
>> getElementById-- l d huwa zghar.

171
00:08:31,670 --> 00:08:36,950
I ma jista 'jgħidlek kif ħafna drabi I jkollhom
getElementById użati u kapitalizzat

172
00:08:36,950 --> 00:08:38,336
ld hemmhekk.

173
00:08:38,336 --> 00:08:39,460
Għaliex dan huwa verament komuni.

174
00:08:39,460 --> 00:08:42,990
Jekk aħna tikteb il-kelma ID, huwa
normalment kapital I kapital D.

175
00:08:42,990 --> 00:08:44,240
U l-kodiċi tiegħi biss ma taħdimx.

176
00:08:44,240 --> 00:08:45,630
U ma nistax figura għaliex.

177
00:08:45,630 --> 00:08:49,490
Dan huwa tassew, tassew, tassew
bug komuni li kulħadd jagħmel,

178
00:08:49,490 --> 00:08:51,890
anke esperti li għandhom
qed tagħmel dan għal dejjem.

179
00:08:51,890 --> 00:08:55,410
Hekk biss tkun taf, getElementById,
li d hija zghar.

180
00:08:55,410 --> 00:09:00,080
U wieħed jittama, li jiffranka diversi
minuti tal-anqas ta 'heartache.

181
00:09:00,080 --> 00:09:02,204
>> Allura dak li ma dan kollu tgħidilna?

182
00:09:02,204 --> 00:09:03,120
Għandna dawn il-metodi.

183
00:09:03,120 --> 00:09:04,161
Għandna dawn il-proprjetajiet.

184
00:09:04,161 --> 00:09:06,610
Issa, jekk nibdew mill
dokument, id-dokument.

185
00:09:06,610 --> 00:09:10,220
kwalunkwe, aħna issa jistgħu jsiru xi
biċċa waħda tal-paġna web tagħna

186
00:09:10,220 --> 00:09:14,870
li aħna rridu li jużaw JavaScript
biss billi ċċempel dawn il-metodi

187
00:09:14,870 --> 00:09:19,940
u jitqawwa l-proprjetajiet
li nsibu f'diversi postijiet.

188
00:09:19,940 --> 00:09:24,890
>> Dan jistgħu jiksbu wordy, dan
document.getElementByID,

189
00:09:24,890 --> 00:09:28,560
forsi jkollhom tikketta l-isem twil,
forsi inti tagħmel sejħiet aktar tard.

190
00:09:28,560 --> 00:09:31,230
Affarijiet jistgħu jiksbu ftit wordy.

191
00:09:31,230 --> 00:09:34,480
U kif programmaturi, kif inti stajt
probabbilment jidhru f'ħafna minn dawn il-videos,

192
00:09:34,480 --> 00:09:36,600
aħna ma simili affarijiet wordy.

193
00:09:36,600 --> 00:09:38,520
>> Aħna nixtiequ li tkun tista 'tagħmel affarijiet malajr.

194
00:09:38,520 --> 00:09:42,640
Allura aħna tixtieq aktar
konċiż biex ngħid xi ħaġa.

195
00:09:42,640 --> 00:09:46,270
Allura dan it-tip ta 'twassal għall-
kunċett ta 'xi ħaġa imsejħa jQuery.

196
00:09:46,270 --> 00:09:49,170
Issa jQuery mhuwiex JavaScript.

197
00:09:49,170 --> 00:09:50,350
Mhuwiex parti mill JavaScript.

198
00:09:50,350 --> 00:09:54,790
>> Huwa librerija li kien miktub
minn xi programmaturi JavaScript

199
00:09:54,790 --> 00:09:57,060
madwar 10 snin ilu.

200
00:09:57,060 --> 00:10:01,300
U l-għan tagħha huwa li jissimplifika dan x'hemm
imsejħa scripting naħa tal-klijent, li

201
00:10:01,300 --> 00:10:04,310
hija bażikament dak li aħna kienu biss
jitkellem dwar ma manipulazzjonijiet DOM.

202
00:10:04,310 --> 00:10:11,090
U hekk jekk jien ridt li timmodifika l-
kulur fl-isfond tal-paġna web tiegħi, forsi

203
00:10:11,090 --> 00:10:11,980
a Div speċifiku.

204
00:10:11,980 --> 00:10:15,325
>> Hawnhekk, jien apparentement jkollna
ElementById colorDiv.

205
00:10:15,325 --> 00:10:16,950
U nixtieq li jistabbilixxu kulur fl-isfond tagħha.

206
00:10:16,950 --> 00:10:20,720
Jekk jien biss bl-użu pur JavaScript
użu tal-Mudell Għan Dokument,

207
00:10:20,720 --> 00:10:23,990
li l-lott ta 'għalf, id-dritt?
document.getElementByID

208
00:10:23,990 --> 00:10:25,531
colorDiv.style.backgroundColor = aħdar.

209
00:10:25,531 --> 00:10:27,260

210
00:10:27,260 --> 00:10:28,050
>> Whew.

211
00:10:28,050 --> 00:10:30,110
Dan kien ħafna jgħidu.

212
00:10:30,110 --> 00:10:31,720
Huwa ħafna għat-tip, wisq.

213
00:10:31,720 --> 00:10:35,760
U għalhekk fil jQuery, nistgħu ngħidu forsi
dan ftit aktar konċiż.

214
00:10:35,760 --> 00:10:39,350
Il-kummerċ off kemm jekk dan huwa forsi ftit
ftit aktar cryptic kollha f'daqqa,

215
00:10:39,350 --> 00:10:39,850
id-dritt?

216
00:10:39,850 --> 00:10:43,580
>> Mill-inqas il twil huwa daqsxejn aktar
spjegazzjoni dwar dak li aħna qed tagħmel.

217
00:10:43,580 --> 00:10:49,947
Dan is-sinjal dollaru, parentesi,
kwotazzjoni waħda, hash, colorDiv, id-dritt?

218
00:10:49,947 --> 00:10:50,780
Xi tfisser?

219
00:10:50,780 --> 00:10:53,640
Ukoll, li bażikament biss
document.getElementByID colorDiv.

220
00:10:53,640 --> 00:10:58,700
>> Iżda huwa dan it-tip ta 'tajpisti
mod ta 'kif isir billi tuża jQuery.

221
00:10:58,700 --> 00:11:01,380
Ejja ħu ħarsa issa
fi ftit ta 'modi differenti

222
00:11:01,380 --> 00:11:04,520
li I jista 'attwalment
tuża din Dokument Għan

223
00:11:04,520 --> 00:11:06,807
Mudell li jimmanipulaw biċċiet ta 'sit tiegħi.

224
00:11:06,807 --> 00:11:09,140
B'mod partikolari, aħna qed tmur
li tkun qed taħdem fuq manipulazzjoni

225
00:11:09,140 --> 00:11:14,090
il-kulur ta 'partikolari
Div, colorDiv, fuq paġna web.

226
00:11:14,090 --> 00:11:15,299
Mela ejja tagħti ħarsa lejn dak.

227
00:11:15,299 --> 00:11:15,798
Kull dritt.

228
00:11:15,798 --> 00:11:16,700
Hekk jien fuq paġna.

229
00:11:16,700 --> 00:11:20,750
Huwa sejjaħ test.html meta inti download
dan jekk inti tixtieq li tinker ma 'dan.

230
00:11:20,750 --> 00:11:24,730
U stajt ltqajna mazz ta '
buttuni fuq din il-paġna.

231
00:11:24,730 --> 00:11:27,730
U jien qal funzjonijiet individwali
għall-kulur fl-isfond, vjola, aħdar,

232
00:11:27,730 --> 00:11:31,330
oranġjo, aħmar, blu, wieħed funzjoni waħda
għall-kulur fl-isfond, avveniment handler

233
00:11:31,330 --> 00:11:34,360
għall-kulur fl-isfond, u l-użu jQuery.

234
00:11:34,360 --> 00:11:38,147
What am I jitkellem dwar
meta qed nagħmel dan?

235
00:11:38,147 --> 00:11:39,230
Allura aħna stajt tidher l-buttuni.

236
00:11:39,230 --> 00:11:41,521
Issa, ejja tagħti ħarsa lejn
xi wħud mill-source code hawn.

237
00:11:41,521 --> 00:11:44,770
Aħna ser tibda bil test.html.

238
00:11:44,770 --> 00:11:48,100
Funzjonijiet Allura individwali għall-isfond
kulur huwa dak li stajt ittajpjat hawn.

239
00:11:48,100 --> 00:11:49,350
Let me iscroll ftit.

240
00:11:49,350 --> 00:11:56,170

241
00:11:56,170 --> 00:11:58,820
>> U tkun taf avviż li I
jkunu definiti dawn il-buttuni

242
00:11:58,820 --> 00:12:03,990
ngħid meta din il-buttuna hija għafast,
sejħa tal-funzjoni dawran vjola.

243
00:12:03,990 --> 00:12:06,670
Meta din il-buttuna hija click, minflok,
sejħa tal-funzjoni dawran aħdar,

244
00:12:06,670 --> 00:12:08,710
dawran oranġjo, dawwar aħmar, jsir blu.

245
00:12:08,710 --> 00:12:11,880
Inti tista 'probabbilment raden li din
hija forsi mhux l-aħjar disinn

246
00:12:11,880 --> 00:12:12,460
sens, id-dritt?

247
00:12:12,460 --> 00:12:16,490
>> Ikun sbieħ jekk I jistgħu
ikollhom approċċ aktar ġenerali.

248
00:12:16,490 --> 00:12:19,570
Ukoll, qabel aħna ser tagħti ħarsa
lejn dak dawn il-ħames funzjonijiet huma

249
00:12:19,570 --> 00:12:24,400
document.getElementByID
colorDiv.style.background = vjola,

250
00:12:24,400 --> 00:12:27,250
aħdar, oranġjo, aħmar,
u blu, rispettivament.

251
00:12:27,250 --> 00:12:30,930
Allura, mhux partikolarment l-aħjar disinn.

252
00:12:30,930 --> 00:12:33,390
>> Is-sett li jmiss ta 'buttuni
Għandi huwa stajt bil-miktub

253
00:12:33,390 --> 00:12:36,380
funzjoni waħda msejħa
bidla fil-kulur li apparentement

254
00:12:36,380 --> 00:12:38,960
jaċċetta string bħala argument tagħha.

255
00:12:38,960 --> 00:12:40,290
Allura dan huwa ftit aħjar.

256
00:12:40,290 --> 00:12:43,840
Vjola, aħdar, oranġjo, aħmar,
blu issa huwa argument.

257
00:12:43,840 --> 00:12:46,230
Hekk stajt bil-miktub aktar ġenerali
każ JavaScript funzjoni,

258
00:12:46,230 --> 00:12:47,771
li tista 'tidher xi ħaġa bħal din.

259
00:12:47,771 --> 00:12:48,680
Jien tgħaddi in.

260
00:12:48,680 --> 00:12:52,090
Dan il-kulur bidla funzjoni huwa
jistennew argument imsejħa kulur.

261
00:12:52,090 --> 00:12:54,970
U jien qal stabbiliti l-
kulur fl-isfond għall-kulur.

262
00:12:54,970 --> 00:12:58,390
Allura hawnhekk jirrappreżenta dak li stajt ltqajna hawn.

263
00:12:58,390 --> 00:12:59,770
Allura dak daqsxejn aħjar.

264
00:12:59,770 --> 00:13:02,740
>> Imma I jista 'jkun kapaċi
tagħmel aħjar minn dik.

265
00:13:02,740 --> 00:13:06,140
Jekk aħna jinżlu għal tagħti ħarsa
lejn is-sitwazzjoni avveniment handler,

266
00:13:06,140 --> 00:13:07,860
issa dawn is-sejħiet kollha tħares l-istess.

267
00:13:07,860 --> 00:13:10,340
Jekk inti recall għall tagħna
diskussjoni fuq handlers avveniment,

268
00:13:10,340 --> 00:13:15,770
I tista 'tikseb informazzjoni dwar liema minn
dawn il-buttuni kien għafast u l-użu li.

269
00:13:15,770 --> 00:13:19,560
>> U għalhekk fil event.JavaScript, stajt
miktub avveniment bidla fil-kulur, li

270
00:13:19,560 --> 00:13:21,110
figuri liema buttuna kienet għafast.

271
00:13:21,110 --> 00:13:23,250
Dik hija l-linja oġġett grillu.

272
00:13:23,250 --> 00:13:25,240
U allura hawnhekk, jiġrilha verament wordy.

273
00:13:25,240 --> 00:13:27,420
Imma dak li qed nagħmel huwa jien
tistabbilixxi l-isfond

274
00:13:27,420 --> 00:13:30,340
kulur li triggerObject inner.HTML.

275
00:13:30,340 --> 00:13:34,170
Dik hija l-test fl
bejn l-tags buttuna.

276
00:13:34,170 --> 00:13:36,500
>> U mbagħad I apparentement jkollhom
li tistabbilixxi li zghar.

277
00:13:36,500 --> 00:13:40,780
U li kif nista 'tikkonverti kollu
spaga biex zghar fil JavaScript użu

278
00:13:40,780 --> 00:13:42,940
li metodu li zghar.

279
00:13:42,940 --> 00:13:46,570
Għaliex meta I jistabbilixxu kulur,
kif jien tipprova tagħmel hawnhekk,

280
00:13:46,570 --> 00:13:48,260
il-kulur għandu jkun kollu zghar.

281
00:13:48,260 --> 00:13:50,920
>> Iżda l-buttuna li kelli,
jekk nieħdu ħarsa ieħor,

282
00:13:50,920 --> 00:13:55,890
avviż li t-test hemm
miktub bil-kapital P għall vjola.

283
00:13:55,890 --> 00:13:59,140
U mbagħad fl-ħafna
qiegħ hawn, I apparentement

284
00:13:59,140 --> 00:14:02,630
tipprova tagħmel dan bl-użu jQuery ukoll.

285
00:14:02,630 --> 00:14:06,000
U f'dan il-każ, jien ma attwalment
sejħa funzjoni fil-livelli kollha.

286
00:14:06,000 --> 00:14:11,430
Stajt biss qal il-klassi li jien
jużaw għal dan l-buttuna buttuna JQ.

287
00:14:11,430 --> 00:14:12,360
Daqshekk.

288
00:14:12,360 --> 00:14:14,950
>> Allura kif ma jQuery taf dak li qed nagħmel?

289
00:14:14,950 --> 00:14:18,740
Ukoll, dan huwa wieħed mill-vantaġġi
slash iżvantaġġi ta 'jQuery.

290
00:14:18,740 --> 00:14:21,560
Hija tista 'tippermetti lili biex tagħmel affarijiet
konċiż ħafna, imma forsi mhux

291
00:14:21,560 --> 00:14:22,570
kif intuwittivament.

292
00:14:22,570 --> 00:14:25,570
Forsi dawk tlieta l-oħra jagħmlu
ftit aktar sens dak li qed nagħmel.

293
00:14:25,570 --> 00:14:29,010
Hawnhekk, għalkemm, x'inhu għaddej?

294
00:14:29,010 --> 00:14:31,940
>> Apparentement, il-ħolqien
funzjoni anonima

295
00:14:31,940 --> 00:14:36,790
li t-tagħbijiet kull meta dokument tiegħi
hija lesta, hekk document.ready,

296
00:14:36,790 --> 00:14:38,760
xi funzjoni jiġri.

297
00:14:38,760 --> 00:14:40,490
Bażikament, meta huwa dokument lesta?

298
00:14:40,490 --> 00:14:42,310
Huwa meta page tiegħi mgħobbija.

299
00:14:42,310 --> 00:14:46,540
>> Dan malajr kemm jista paġna tiegħi mgħobbija, l
wara funzjoni huwa dejjem lest.

300
00:14:46,540 --> 00:14:54,310
Hija tgħid, jekk oġġett ta 'tip jQButton,
jew jekk klassi jQButton ġie għafast,

301
00:14:54,310 --> 00:14:55,570
tesegwixxi din il-funzjoni.

302
00:14:55,570 --> 00:14:59,360
Allura hawnhekk żewġ funzjonijiet anonimi,
wieħed definit ġewwa l-oħra.

303
00:14:59,360 --> 00:15:03,930
>> Allura kuntest kollu tiegħi
hawnhekk s'issa hija paġna tiegħi

304
00:15:03,930 --> 00:15:06,520
meta tagħbijiet li hija ssejjaħ il-funzjoni.

305
00:15:06,520 --> 00:15:09,740
U din il-funzjoni hija stennija
għal buttuna biex jiġu għafast.

306
00:15:09,740 --> 00:15:14,490
U meta buttuna hija għafast, JQ
buttuna speċifikament huwa għafast,

307
00:15:14,490 --> 00:15:17,150
jitlob dan ieħor
funzjoni, li se

308
00:15:17,150 --> 00:15:21,250
li tiffissa l-isfond
kulur tal colorDiv li jkun

309
00:15:21,250 --> 00:15:25,990
tkun xi test huwa fl bejn il-tags.

310
00:15:25,990 --> 00:15:28,050
>> Dan huwa l-kunċett ta '
li button kienet għafast.

311
00:15:28,050 --> 00:15:31,230
Iżda xort'oħra, dan huwa tip ta '
iġib ruħu simili għal avveniment.

312
00:15:31,230 --> 00:15:34,460
Huwa biss bl-istess mod I
jesprimi dan fil jQuery.

313
00:15:34,460 --> 00:15:36,790
Għal darb'oħra, huwa probabbilment
ħafna aktar intimidanti.

314
00:15:36,790 --> 00:15:40,840
Mhuwiex ċar kemm
xi ħaġa bħal event.js,

315
00:15:40,840 --> 00:15:45,080
li hija forsi ftit aktar
verbose, iżda xi ftit inqas

316
00:15:45,080 --> 00:15:46,000
intimidanti.

317
00:15:46,000 --> 00:15:51,460
>> Imma jekk aħna pop lura lill-browser tiegħi
tieqa, jekk nibda clicking-- ukoll,

318
00:15:51,460 --> 00:15:52,690
li biddel għal vjola.

319
00:15:52,690 --> 00:15:54,450
Dan huwa aħdar jintuża l-metodu string.

320
00:15:54,450 --> 00:15:56,500
Dan huwa oranġjo tuża l-avveniment handler.

321
00:15:56,500 --> 00:15:58,300
>> Dan huwa aħmar jużaw jQuery, id-dritt?

322
00:15:58,300 --> 00:16:01,270
Huma kollha jġibu ruħhom eżattament l-istess.

323
00:16:01,270 --> 00:16:06,509
Huma biss tagħmel dan bl-użu differenti
approċċi biex isolvu l-problema.

324
00:16:06,509 --> 00:16:08,550
Hemm ħafna aktar biex
jQuery allura aħna qed ċertament

325
00:16:08,550 --> 00:16:10,050
ser jitkellmu dwar f'dan il-video.

326
00:16:10,050 --> 00:16:15,410
Imma jekk inti tixtieq titgħallem aktar, inti tista
mur l-tip ta 'dokumentazzjoni jQuery

327
00:16:15,410 --> 00:16:19,710
u jitgħallmu pjuttost ftit aktar dwar
din il-librerija flessibbli ħafna, li

328
00:16:19,710 --> 00:16:22,550
hija kbira biex isir naħa tal-klijent
scripting bħal dak li kienu qed jagħmlu

329
00:16:22,550 --> 00:16:26,240
li jimmanipulaw il-ħarsa
u jħossu tal-paġna web tagħna

330
00:16:26,240 --> 00:16:28,750
mal-Mudell Għan Dokument.

331
00:16:28,750 --> 00:16:29,650
Jien Doug Lloyd.

332
00:16:29,650 --> 00:16:31,930
Dan huwa CS50.

333
00:16:31,930 --> 00:16:34,022