1 00:00:00,000 --> 00:00:04,439 2 00:00:04,439 --> 00:00:07,230 Doug Lloyd: Nan videyo sa a, nou te vle yo rele soti atansyon separe 3 00:00:07,230 --> 00:00:09,110 nan yon trè patikilye eleman nan JavaScript 4 00:00:09,110 --> 00:00:11,350 ke ou ta ka jwenn sou la men lè w ap kòmanse 5 00:00:11,350 --> 00:00:15,750 nan travay sou manipile paj wèb ak chanje sa ki ekri nan paj entènèt ou 6 00:00:15,750 --> 00:00:16,460 sou vole a. 7 00:00:16,460 --> 00:00:19,450 Epi sa a, nosyon de Dokiman objè ki gen konpòtman egzanplè a. 8 00:00:19,450 --> 00:00:23,030 Se konsa, kòm nou te wè nan videyo nou an sou JavaScript, objè yo trè fleksib. 9 00:00:23,030 --> 00:00:24,750 >> Apre sa, yo ka gen ladan jaden yo divès kalite. 10 00:00:24,750 --> 00:00:28,075 Epi menm si nou pa t 'ale nan yon anpil nan detay, moun jaden yo oswa pwopriyete yo, 11 00:00:28,075 --> 00:00:30,200 ke nou ta pwobableman plis yon fason ki apwopriye rele yo 12 00:00:30,200 --> 00:00:33,915 nan yon kontèks la nan yon objè, menm moun pwopriyete kapab lòt objè yo. 13 00:00:33,915 --> 00:00:36,210 Apre sa, andedan nan moun ki objè kapab lòt objè yo. 14 00:00:36,210 --> 00:00:39,630 >> Ou gen sa a objè gwo anpil ak yon anpil nan lòt objè 15 00:00:39,630 --> 00:00:43,550 andedan nan li, ki sòt de kreye ide sa a nan yon gwo pyebwa. 16 00:00:43,550 --> 00:00:47,540 Koulye a, dokiman objè a se yon objè trè espesyal nan JavaScript 17 00:00:47,540 --> 00:00:52,580 ki òganize tout entènèt ou paj anba sa a sòt de parapli 18 00:00:52,580 --> 00:00:53,470 nan yon objè. 19 00:00:53,470 --> 00:00:56,770 Se konsa, andedan nan dokiman an objè yo se objè prezante 20 00:00:56,770 --> 00:00:59,630 tèt la ansanm ak tout kò nan paj entènèt ou an. 21 00:00:59,630 --> 00:01:03,760 >> Anndan nan moun lòt objè, et setra, et setra, 22 00:01:03,760 --> 00:01:08,411 jouk paj tout antye entènèt ou gen te òganize nan sa a objè gwo. 23 00:01:08,411 --> 00:01:09,660 Ki sa ki nan tèt la isit la, dwa? 24 00:01:09,660 --> 00:01:12,170 Bon, nou konnen ki jan yo travay ak objè ki nan JavaScript. 25 00:01:12,170 --> 00:01:15,840 >> Se konsa, si nou gen yon bagay ki refere a paj wèb nou an tout antye, ki 26 00:01:15,840 --> 00:01:19,590 vle di lè w rele repons ki kòrèk la metòd yo manipile ki objè 27 00:01:19,590 --> 00:01:22,360 oswa modifye sèten nan pwopriyete li yo, nou 28 00:01:22,360 --> 00:01:25,500 kapab chanje eleman ki nan paj nou an pwogramasyon 29 00:01:25,500 --> 00:01:30,210 lè l sèvi avèk JavaScript olye pou yo gen nan kòd bagay sa yo ak, di, HTML. 30 00:01:30,210 --> 00:01:33,760 Se konsa, isit la nan yon egzanp yon trè senp paj entènèt, dwa? 31 00:01:33,760 --> 00:01:35,850 Li nan te resevwa Tags HTML, yon tèt. 32 00:01:35,850 --> 00:01:37,979 >> Anndan nan gen yon Tit, alo nan lemonn. 33 00:01:37,979 --> 00:01:38,770 Lè sa a, mwen gen yon kò. 34 00:01:38,770 --> 00:01:40,686 Anndan de sa, mwen gen twa bagay diferan. 35 00:01:40,686 --> 00:01:44,170 Mwen gen yon tag H2 header, yon paragraf, ak yon lyen. 36 00:01:44,170 --> 00:01:45,920 Sa a se yon paj entènèt trè senp. 37 00:01:45,920 --> 00:01:48,590 >> Oke, sa ta ka dokiman an objeksyon pou gade sa a sanble? 38 00:01:48,590 --> 00:01:50,700 Oke, li nan yon ti kras pè petèt nan premye. 39 00:01:50,700 --> 00:01:52,510 Men, li la vrèman jis yon gwo pyebwa. 40 00:01:52,510 --> 00:01:54,890 Apre sa, nan rasin nan anpil nan li se dokiman. 41 00:01:54,890 --> 00:02:00,030 >> Anndan nan dokiman an se yon lòt objè refere li a HTML a nan paj m 'yo. 42 00:02:00,030 --> 00:02:02,660 Apre sa, HTML a nan paj mwen an se tout bagay sa yo. 43 00:02:02,660 --> 00:02:06,900 Lè sa a, andedan nan HTML a objè, mwen gen yon objè tèt, 44 00:02:06,900 --> 00:02:09,000 ki vle di tout bagay la. 45 00:02:09,000 --> 00:02:11,009 >> Apre sa, andedan nan la, Mwen gen yon objè tit. 46 00:02:11,009 --> 00:02:15,620 Ak andedan nan la, mwen gen yon lòt objeksyon sa se sèlman alo lemonn. 47 00:02:15,620 --> 00:02:18,020 Mwen te kapab gen kò mwen an reprezante tankou sa a. 48 00:02:18,020 --> 00:02:22,850 >> Anndan nan kò m ', mwen gen yon H2 objè ak yon objè ki p pou paragraf 49 00:02:22,850 --> 00:02:25,270 ak yon yon objè pou yon lyen. 50 00:02:25,270 --> 00:02:29,660 Se konsa, sa a tout antye yerachi ka reprezante kòm yon gwo pye bwa 51 00:02:29,660 --> 00:02:31,990 avèk anpil ki pi piti ti kras bagay ki t'ap soti nan li. 52 00:02:31,990 --> 00:02:33,740 Koulye a, nan kou, lè nou ap pwogramasyon, nou 53 00:02:33,740 --> 00:02:35,560 pa panse a bagay sa yo tankou yon gwo pye bwa. 54 00:02:35,560 --> 00:02:37,980 Nou vle wè vrè Kòd bagay ki gen rapò. 55 00:02:37,980 --> 00:02:40,790 >> Apre sa, erezman, nou kapab sèvi ak zouti pwomotè nou an 56 00:02:40,790 --> 00:02:46,080 ki aktyèlman pran yon gade nan sit entènèt sa a nan dokiman objè. 57 00:02:46,080 --> 00:02:48,150 Li kite yo fè sa. 58 00:02:48,150 --> 00:02:49,580 Se konsa, mwen te louvri moute yon tab navigatè. 59 00:02:49,580 --> 00:02:51,540 >> Apre sa, mwen te louvri moute Developer Zouti. 60 00:02:51,540 --> 00:02:54,460 Ak nan videyo mwen sou JavaScript, mwen mansyone ke konsole a se pa 61 00:02:54,460 --> 00:02:56,770 sèlman yon sél kote dekwa kote nou enprime enfòmasyon, 62 00:02:56,770 --> 00:02:59,560 li la tou yon plas kote nou kapab enfòmasyon opinyon. 63 00:02:59,560 --> 00:03:01,380 Nan kontèks sa a, ki sa Mwen pral di se 64 00:03:01,380 --> 00:03:05,720 Mwen ta renmen jwenn tounen objè yo dokiman, 65 00:03:05,720 --> 00:03:07,502 Se konsa, mwen ka kòmanse gen yon gade nan li. 66 00:03:07,502 --> 00:03:08,460 Se konsa, kouman ta ka m 'fè sa a? 67 00:03:08,460 --> 00:03:10,740 Oke, si mwen vle òganize li vrèman joliman, 68 00:03:10,740 --> 00:03:16,317 Mwen pral di console.dir, D-I-R. Koulye a, mwen sèvi ak console.log ekri ak lèt ​​detache jis 69 00:03:16,317 --> 00:03:17,400 soti yon bagay trè senp. 70 00:03:17,400 --> 00:03:20,450 Men, si mwen vle òganize sa a yerarchik tankou yon objè, 71 00:03:20,450 --> 00:03:23,800 Mwen vle li sòt de estriktire tankou yon estrikti anyè. 72 00:03:23,800 --> 00:03:27,400 >> Se konsa, mwen vle console.dir dokiman. 73 00:03:27,400 --> 00:03:28,430 Mwen pral frape Antre nan. 74 00:03:28,430 --> 00:03:32,350 E yo gen dwa anba a li kounye a, epi mwen pral rale nan isit la, 75 00:03:32,350 --> 00:03:36,000 Mwen te gen dokiman sa a repons ak yon ti kras flèch akote l. 76 00:03:36,000 --> 00:03:39,470 Koulye a, lè mwen louvri flèch sa a, gen k ap pase yo gen yon anpil nan bagay. 77 00:03:39,470 --> 00:03:42,560 >> Men, nou ap ale nan inyore yon anpil nan li epi li jis kalite konsantre 78 00:03:42,560 --> 00:03:46,250 sou pati ki pi enpòtan, se konsa nou ka kòmanse navige dokiman sa a. 79 00:03:46,250 --> 00:03:50,125 Genyen yon anpil plis nan Dom la pase jis paran nœuds ak nœuds timoun. 80 00:03:50,125 --> 00:03:51,500 Genyen yon anpil nan bagay Segondè. 81 00:03:51,500 --> 00:03:52,280 >> Se konsa, mwen pral louvri sa a leve. 82 00:03:52,280 --> 00:03:54,610 Apre sa, nan yon anpil tout nan bagay ki Pops leve. 83 00:03:54,610 --> 00:03:59,000 Men, tout mwen pran swen sou se dwa isit la, nœuds timoun. 84 00:03:59,000 --> 00:04:00,410 Se pou nou louvri ki yo. 85 00:04:00,410 --> 00:04:03,810 >> Anndan nan la mwen wè yon bagay yo konnen yo, HTML. 86 00:04:03,810 --> 00:04:07,670 Se konsa, andedan nan dokiman nou an yon nivo desann, HTML. 87 00:04:07,670 --> 00:04:08,550 Mwen louvri ki yo. 88 00:04:08,550 --> 00:04:10,380 Ki sa yo nou tann? 89 00:04:10,380 --> 00:04:13,760 >> Si ou sonje nan dyagram nou an, sa ki ta dwe nou jwenn andedan nan HTML? 90 00:04:13,760 --> 00:04:17,275 Ki de nœuds ki pi ba pase l 'nan pye bwa a? 91 00:04:17,275 --> 00:04:17,899 Se pou yo jwenn deyò. 92 00:04:17,899 --> 00:04:18,940 Nou louvri moute HTML. 93 00:04:18,940 --> 00:04:22,079 Nou ale desann nan pitit li yo nœuds. 94 00:04:22,079 --> 00:04:23,440 >> Pop ki louvri. 95 00:04:23,440 --> 00:04:25,990 Genyen tèt ansanm ak tout kò. 96 00:04:25,990 --> 00:04:28,540 Apre sa, nou ka louvri moute tèt la. 97 00:04:28,540 --> 00:04:30,460 Ale nan pitit li yo nœuds. 98 00:04:30,460 --> 00:04:31,460 Oke, gen nan tit la. 99 00:04:31,460 --> 00:04:33,293 >> Apre sa, nou t 'ka ale sou yo ak sou sou tankou sa a pou tout tan. 100 00:04:33,293 --> 00:04:34,770 Nou ta ka fè sa a ak kò kòm byen. 101 00:04:34,770 --> 00:04:40,090 Men, gen se yon fason pou nou fè yon gade nan dokiman an òganize kòm yon objè gwo. 102 00:04:40,090 --> 00:04:42,610 Men, si nou gade nan se yon gwo objè ki sanble yon anpil 103 00:04:42,610 --> 00:04:47,480 tankou kòd, sa vle di ke nou kapab kòmanse yo manipile sa a objè gwo lè l sèvi avèk 104 00:04:47,480 --> 00:04:51,220 Kòd chanje sa nou an sit sanble ak santi l tankou. 105 00:04:51,220 --> 00:04:54,920 >> Se konsa, sa a, se yon zouti bèl pwisan nou gen a jete nou an kounye a. 106 00:04:54,920 --> 00:04:57,360 Se konsa, kòm nou jis te wè, nan dokiman objè tèt li 107 00:04:57,360 --> 00:05:01,392 ak tout nan objè yo andedan nan li gen pwopriyete ak metòd, jis 108 00:05:01,392 --> 00:05:04,100 tankou nenpòt ki lòt objè ki nou te te travay ak nan JavaScript. 109 00:05:04,100 --> 00:05:08,370 Men, nou ka sèvi ak sa yo pwopriyete ak sèvi ak metòd sa yo sòt de fè egzèsis desann 110 00:05:08,370 --> 00:05:10,900 soti nan dokiman an gwo epi pou yo jwenn pi ba ak pi ba ak pi ba, 111 00:05:10,900 --> 00:05:13,360 sibtilite ak sibtilite grenn a detay, jiskaske nou 112 00:05:13,360 --> 00:05:17,510 li ale nan yon moso trè espesifik nan nou an paj entènèt ke nou vle chanje. 113 00:05:17,510 --> 00:05:22,700 >> Lè nou mete pwopriyete a Dokimante objè oswa rele metòd sa yo, 114 00:05:22,700 --> 00:05:24,450 bagay ka rive nan paj wèb nou an. 115 00:05:24,450 --> 00:05:28,420 Apre sa, nou pa bezwen fè nenpòt ki entérésan gen chanjman sa yo pran efè. 116 00:05:28,420 --> 00:05:33,160 >> Epi sa a, yon kapasite trè fre yo gen lè nou ap travay ak kòd. 117 00:05:33,160 --> 00:05:37,185 Se konsa, sa yo se kèk nan sa yo pwopriyete ki fè pati yon dokiman objè? 118 00:05:37,185 --> 00:05:40,100 Oke, ou pwobableman wè yon koup la yo vrèman byen vit 119 00:05:40,100 --> 00:05:42,700 kòm nou te zipping a dokiman an jeyan 120 00:05:42,700 --> 00:05:45,150 objè nou jis te wè nan navigatè wèb la. 121 00:05:45,150 --> 00:05:48,420 >> Men, yon koup la sa yo pwopriyete ta ka bagay sa yo tankou HTML anndan an. 122 00:05:48,420 --> 00:05:52,950 Epi ou ta ka menm sonje m ' lè l sèvi avèk sa a nan videyo a JavaScript 123 00:05:52,950 --> 00:05:54,950 nan fen a anpil lè m ' te pale sou evènman yo. 124 00:05:54,950 --> 00:05:56,125 Ki sa sa HTML anndan te ye? 125 00:05:56,125 --> 00:05:59,030 Oke, li nan jis sa ki nan nan ant etikèt yo. 126 00:05:59,030 --> 00:06:01,590 >> Se konsa, HTML anndan Tanp lan, pou egzanp, nan tit la 127 00:06:01,590 --> 00:06:05,390 tag, si nou te kenbe pral nan ki egzanp yon ti moman de sa, 128 00:06:05,390 --> 00:06:08,020 ta gen alo lemonn. 129 00:06:08,020 --> 00:06:10,140 Sa ki te tit la nan paj nou an. 130 00:06:10,140 --> 00:06:12,370 Lòt pwopriyete enkli non ne, ki 131 00:06:12,370 --> 00:06:15,810 se non an nan yon HTML eleman tankou tit. 132 00:06:15,810 --> 00:06:19,100 ID, ki se ID a atribi nan yon eleman HTML. 133 00:06:19,100 --> 00:06:23,790 >> Sonje byen, nou ka espesyalman endike eleman espesifik nan HTML nou an 134 00:06:23,790 --> 00:06:27,510 ak yon atribi ID, ki se nòmalman vini an sou la men nan yon kontèks CSS, 135 00:06:27,510 --> 00:06:29,000 espesyalman. 136 00:06:29,000 --> 00:06:33,217 Ne paran, ki se yon referans a sa ki nan jis moute pi wo a m 'nan Dom la. 137 00:06:33,217 --> 00:06:35,800 Apre sa, nœuds timoun, ki se yon referans a sa ki nan desann anba a m '. 138 00:06:35,800 --> 00:06:37,950 Apre sa, nou te wè yon anpil nan ki jis kap nan. 139 00:06:37,950 --> 00:06:42,970 Nœuds Timoun, lè sa a jan nou te resevwa pi ba ak pi ba nan pye bwa an. 140 00:06:42,970 --> 00:06:46,590 >> Atribi, sa se sèlman yon etalaj a atribi nan eleman nan HTML. 141 00:06:46,590 --> 00:06:50,270 Se konsa, yon egzanp sou atribi ta ka gen si ou genyen yon tag imaj, 142 00:06:50,270 --> 00:06:54,090 li anjeneral gen yon atribi sous, petèt yon wotè ak yon atribi lajè. 143 00:06:54,090 --> 00:06:57,120 Se konsa, ki ta jis pou yon etalaj nan tout nan atribi ki asosye 144 00:06:57,120 --> 00:06:59,300 ak sa eleman HTML. 145 00:06:59,300 --> 00:07:04,140 >> Style se yon lòt youn ki reprezante CSS la 146 00:07:04,140 --> 00:07:06,050 manier nan yon eleman an patikilye. 147 00:07:06,050 --> 00:07:08,310 Apre sa, pita sou nan sa a videyo, nou pral espesyalman 148 00:07:08,310 --> 00:07:14,592 style ogmante fè yon koup nan chanjman nan sit entènèt nou an. 149 00:07:14,592 --> 00:07:15,800 Se konsa, sa yo se kèk pwopriyete. 150 00:07:15,800 --> 00:07:17,591 >> Apre sa, gen tou gen kèk metòd ke nou kapab 151 00:07:17,591 --> 00:07:22,450 itilize yo tou pi vit petèt izole eleman nan Dokiman objè a. 152 00:07:22,450 --> 00:07:26,730 Petèt, pi versatile a sa yo ke yo te getElementById a. 153 00:07:26,730 --> 00:07:31,190 Se konsa, mwen ta ka di yon bagay tankou, paske sonje li nan yon metòd pou Dokiman an 154 00:07:31,190 --> 00:07:34,880 Objè, document.getElementById. 155 00:07:34,880 --> 00:07:39,820 >> Ak andedan nan tout sa yo parantèz, presize yon eleman HTML ak yon ID patikilye 156 00:07:39,820 --> 00:07:42,330 atribi ke mwen te deja mete, epi mwen pral imedyatman 157 00:07:42,330 --> 00:07:46,685 ale dwa ak sa yo ki eleman nan sit wèb la an jeneral. 158 00:07:46,685 --> 00:07:49,310 Se konsa, mwen pa bezwen petèt fè egzèsis desann nan chak kouch sèl. 159 00:07:49,310 --> 00:07:52,841 Mwen ka jis sèvi ak metòd sa a yo jwenn li, sòt de tankou yon misil k ap chèche chalè, 160 00:07:52,841 --> 00:07:53,340 dwa? 161 00:07:53,340 --> 00:07:56,300 Li jis ale epi li jwenn ekzakteman ki sa li la kap chèche. 162 00:07:56,300 --> 00:07:59,290 >> GetElementsByTagName se trè menm jan an nan Lespri Bondye. 163 00:07:59,290 --> 00:08:02,500 Petèt sa a ta jwenn tout nan la Tags fonse oswa tout etikèt yo p 164 00:08:02,500 --> 00:08:05,920 ak ban m 'yon etalaj de tout bagay ke mwen te ka Lè sa a, travay avèk yo. 165 00:08:05,920 --> 00:08:12,080 appendChild ajoute yon bagay yon nivo desann nan pyebwa sa a. 166 00:08:12,080 --> 00:08:16,440 >> Se konsa, mwen ka ajoute yon nouvo antye eleman yon nivo pi ba yo. 167 00:08:16,440 --> 00:08:19,700 Oswa mwen ka retire yon eleman sa a, se yon nivo pi ba osi byen si mwen vle 168 00:08:19,700 --> 00:08:22,870 yo efase yon bagay nan men paj entènèt mwen an. 169 00:08:22,870 --> 00:08:28,480 Koulye a, yon nòt kodaj rapid ak yon rapid maltèt ekonomize nòt, èspere ke. 170 00:08:28,480 --> 00:08:31,670 >> getElementById-- d la se miniskil. 171 00:08:31,670 --> 00:08:36,950 Mwen pa ka di w kouman anpil fwa mwen gen itilize getElementById ak kapitalize 172 00:08:36,950 --> 00:08:38,336 d a la. 173 00:08:38,336 --> 00:08:39,460 Paske li vrèman komen. 174 00:08:39,460 --> 00:08:42,990 Si nou ekri ID a mo, li nan anjeneral kapital mwen kapital D. 175 00:08:42,990 --> 00:08:44,240 Ak kòd mwen jis pa travay. 176 00:08:44,240 --> 00:08:45,630 Apre sa, mwen pa kapab konnen ki pou ki rezon. 177 00:08:45,630 --> 00:08:49,490 Sa a se yon reyèlman, reyèlman, reyèlman komen ensèk ke tout moun fè, 178 00:08:49,490 --> 00:08:51,890 menm ekspè ki gen te fè sa a pou tout tan. 179 00:08:51,890 --> 00:08:55,410 Se konsa, jis dwe konnen, getElementById, ki se d miniskil. 180 00:08:55,410 --> 00:09:00,080 Ak èspere ke, ki sove ou plizyè minit nan pi piti nan chagren. 181 00:09:00,080 --> 00:09:02,204 >> Se konsa, sa tout bagay sa yo fè nou konnen? 182 00:09:02,204 --> 00:09:03,120 Nou gen metòd sa yo. 183 00:09:03,120 --> 00:09:04,161 Nou gen pwopriyete sa yo. 184 00:09:04,161 --> 00:09:06,610 Koulye a, si nou kòmanse soti nan dokiman, dokiman. 185 00:09:06,610 --> 00:09:10,220 kèlkeswa sa, nou kapab kounye a ale nan nenpòt ki sèl moso nan paj entènèt nou an 186 00:09:10,220 --> 00:09:14,870 ke nou vle lè l sèvi avèk JavaScript jis lè w rele sa yo metòd yo 187 00:09:14,870 --> 00:09:19,940 ak swe pwopriyete yo ke nou jwenn nan divès kote yo ye. 188 00:09:19,940 --> 00:09:24,890 >> Sa a ka jwenn bavar, sa a document.getElementByID, 189 00:09:24,890 --> 00:09:28,560 petèt gen yon non tag long, petèt ou fè plis apèl pita sou. 190 00:09:28,560 --> 00:09:31,230 Bagay sa yo ka jwenn yon ti kras bavar. 191 00:09:31,230 --> 00:09:34,480 Ak jan pwogramasyon, menm jan ou te pwobableman wè nan anpil nan videyo sa yo, 192 00:09:34,480 --> 00:09:36,600 nou pa renmen bagay sa yo bavar. 193 00:09:36,600 --> 00:09:38,520 >> Nou renmen pou kapab fè bagay sa yo byen vit. 194 00:09:38,520 --> 00:09:42,640 Se konsa, nou ta renmen yon pi plis fason brèf yo di yon bagay. 195 00:09:42,640 --> 00:09:46,270 Se konsa, sa a sòt de mennen nan la nosyon nan yon bagay yo rele jQuery. 196 00:09:46,270 --> 00:09:49,170 Koulye a, jQuery se pa JavaScript. 197 00:09:49,170 --> 00:09:50,350 Li pa yon pati nan JavaScript. 198 00:09:50,350 --> 00:09:54,790 >> Li se yon bibliyotèk ki te ekri pa kèk pwogramasyon JavaScript 199 00:09:54,790 --> 00:09:57,060 apeprè 10 ane de sa. 200 00:09:57,060 --> 00:10:01,300 Ak objektif li yo se yo senplifye sa a sa ki nan rele kliyan scripting bò, ki 201 00:10:01,300 --> 00:10:04,310 se fondamantalman ki sa nou te jis ap pale de ak Dom manipilasyon. 202 00:10:04,310 --> 00:10:11,090 Se konsa, si mwen te vle modifye an koulè background nan paj entènèt mwen an, petèt 203 00:10:11,090 --> 00:10:11,980 yon Div espesifik. 204 00:10:11,980 --> 00:10:15,325 >> Isit la, mwen aparamman ap resevwa ElementById colorDiv. 205 00:10:15,325 --> 00:10:16,950 Apre sa, mwen vle yo mete koulè background li yo. 206 00:10:16,950 --> 00:10:20,720 Si mwen jis lè l sèvi avèk pi bon kalite JavaScript lè l sèvi avèk objè ki gen konpòtman egzanplè Dokiman an, 207 00:10:20,720 --> 00:10:23,990 sa a, se yon anpil nan bagay, dwa? document.getElementByID 208 00:10:23,990 --> 00:10:25,531 colorDiv.style.backgroundColor = vèt. 209 00:10:25,531 --> 00:10:27,260 210 00:10:27,260 --> 00:10:28,050 >> Wou. 211 00:10:28,050 --> 00:10:30,110 Sa ki te yon anpil yo di. 212 00:10:30,110 --> 00:10:31,720 Li se yon anpil yo tape, tou. 213 00:10:31,720 --> 00:10:35,760 Se konsa, nan jQuery, nou ka petèt di sa a yon ti jan plis presizyon. 214 00:10:35,760 --> 00:10:39,350 Komès la koupe yo te li nan petèt yon ti kras ti jan pi plis skre tout nan yon toudenkou, 215 00:10:39,350 --> 00:10:39,850 dwa? 216 00:10:39,850 --> 00:10:43,580 >> Omwen lontan an se yon ti jan pi plis eksplikasyon tankou sa ki nou ap fè. 217 00:10:43,580 --> 00:10:49,947 Siy dola sa a, parantèz, sèl quote, regle, colorDiv, dwa? 218 00:10:49,947 --> 00:10:50,780 Ki sa sa vle di? 219 00:10:50,780 --> 00:10:53,640 Oke, sa a, se fondamantalman jis document.getElementByID colorDiv. 220 00:10:53,640 --> 00:10:58,700 >> Men, li la sa a sòt de steno fason pou fè li lè l sèvi avèk jQuery. 221 00:10:58,700 --> 00:11:01,380 Se pou nou jis pran yon gade kounye a Yon koup nan diferan fason 222 00:11:01,380 --> 00:11:04,520 ke mwen ta ka aktyèlman itilize Dokiman objè sa a 223 00:11:04,520 --> 00:11:06,807 Ki gen konpòtman egzanplè yo manipile moso nan sit m 'yo. 224 00:11:06,807 --> 00:11:09,140 An patikilye, nou ap ale yo dwe ap travay sou manipile 225 00:11:09,140 --> 00:11:14,090 koulè a ​​nan yon patikilye Div, colorDiv, sou yon paj entènèt. 226 00:11:14,090 --> 00:11:15,299 Se konsa, kite a pran yon gade nan sa. 227 00:11:15,299 --> 00:11:15,798 Tout dwa. 228 00:11:15,798 --> 00:11:16,700 Se konsa, mwen sou yon paj. 229 00:11:16,700 --> 00:11:20,750 Yo rele li test.html lè ou download sa a si ou vle Tinker ak sa a. 230 00:11:20,750 --> 00:11:24,730 Apre sa, mwen te gen yon pakèt moun sou bouton sou paj sa a. 231 00:11:24,730 --> 00:11:27,730 Apre sa, mwen ap di fonksyon endividyèl pou koulè background, koulè wouj violèt, vèt, 232 00:11:27,730 --> 00:11:31,330 zoranj, wouj, ble, yon sèl fonksyon sèl pou koulè background, evènman kap okipe 233 00:11:31,330 --> 00:11:34,360 pou koulè background, e ap itilize jQuery. 234 00:11:34,360 --> 00:11:38,147 Kisa mwen ap pale de lè m 'ap fè sa a? 235 00:11:38,147 --> 00:11:39,230 Se konsa, nou te wè bouton sa yo. 236 00:11:39,230 --> 00:11:41,521 Koulye a, kite a pran yon gade nan kèk nan kòd la sous isit la. 237 00:11:41,521 --> 00:11:44,770 Nou pral kòmanse ak test.html. 238 00:11:44,770 --> 00:11:48,100 Fonksyon Se konsa, endividyèl pou jan nou koumanse koulè se sa m 'te tape isit la. 239 00:11:48,100 --> 00:11:49,350 Kite m 'woulo liv yon ti kras. 240 00:11:49,350 --> 00:11:56,170 241 00:11:56,170 --> 00:11:58,820 >> Apre sa, ou pral avi ke mwen te defini sa yo bouton 242 00:11:58,820 --> 00:12:03,990 yo di lè se bouton sa-a klike, rele fonksyon an vire koulè wouj violèt. 243 00:12:03,990 --> 00:12:06,670 Lè yo bouton sa-a klike sou, olye, rele fonksyon an vire vèt, 244 00:12:06,670 --> 00:12:08,710 vire zoranj, vire wouj, vire ble. 245 00:12:08,710 --> 00:12:11,880 Ou ka pwobableman devine ke sa a se petèt pa desen an pi bon 246 00:12:11,880 --> 00:12:12,460 sans, dwa? 247 00:12:12,460 --> 00:12:16,490 >> Li ta dwe nice si mwen te kapab gen yon apwòch plis jeneral. 248 00:12:16,490 --> 00:12:19,570 Oke, premye nou pral pran yon gade nan sa ki moun senk fonksyon yo 249 00:12:19,570 --> 00:12:24,400 document.getElementByID colorDiv.style.background = koulè wouj violèt, 250 00:12:24,400 --> 00:12:27,250 vèt, zoranj, wouj, ak ble, respektivman. 251 00:12:27,250 --> 00:12:30,930 Se konsa, pa patikilyèman desen an pi byen. 252 00:12:30,930 --> 00:12:33,390 >> Seri a pwochen nan bouton M 'genyen se mwen te ekri 253 00:12:33,390 --> 00:12:36,380 yon fonksyon sèl rele chanje koulè ki aparamman 254 00:12:36,380 --> 00:12:38,960 aksepte yon fisèl kòm agiman li yo. 255 00:12:38,960 --> 00:12:40,290 Se konsa, sa a se yon ti jan pi byen. 256 00:12:40,290 --> 00:12:43,840 Koulè wouj violèt, vèt, zoranj, wouj, ble se kounye a gen yon diskisyon. 257 00:12:43,840 --> 00:12:46,230 Se konsa, mwen te ekri yon pi plis jeneral ka JavaScript fonksyon, 258 00:12:46,230 --> 00:12:47,771 ki ta sanble yon bagay tankou sa a. 259 00:12:47,771 --> 00:12:48,680 M 'ap pase nan. 260 00:12:48,680 --> 00:12:52,090 Sa a koulè chanjman fonksyon se tann yon diskisyon rele koulè. 261 00:12:52,090 --> 00:12:54,970 Apre sa, mwen ap di mete an koulè background ak koulè. 262 00:12:54,970 --> 00:12:58,390 Se konsa, isit reprezante ki sa mwen te gen isit la. 263 00:12:58,390 --> 00:12:59,770 Se konsa, sa a, se yon ti jan pi byen. 264 00:12:59,770 --> 00:13:02,740 >> Men, mwen ka kapab fè pi bon pase sa. 265 00:13:02,740 --> 00:13:06,140 Si nou desann nan pran yon gade nan sitiyasyon an evènman kap okipe, 266 00:13:06,140 --> 00:13:07,860 kounye a tout apèl sa yo gade menm bagay la. 267 00:13:07,860 --> 00:13:10,340 Si ou sonje pou nou an diskisyon sou pòtè evènman, 268 00:13:10,340 --> 00:13:15,770 Mwen ka jwenn enfòmasyon sou ki nan bouton sa yo te klike epi sèvi ak sa. 269 00:13:15,770 --> 00:13:19,560 >> Se konsa, nan event.JavaScript, mwen te ekri evènman chanje koulè, ki 270 00:13:19,560 --> 00:13:21,110 figi konnen ki bouton te klike. 271 00:13:21,110 --> 00:13:23,250 Sa a liy lan deklanche objè. 272 00:13:23,250 --> 00:13:25,240 Lè sa a, isit la, li vin reyèlman bavar. 273 00:13:25,240 --> 00:13:27,420 Men, sa m ap fè a se mwen se mete background nan 274 00:13:27,420 --> 00:13:30,340 koulè nan triggerObject inner.HTML. 275 00:13:30,340 --> 00:13:34,170 Sa a tèks la nan ant etikèt yo bouton. 276 00:13:34,170 --> 00:13:36,500 >> Lè sa a, mwen aparamman gen yo mete l 'bay miniskil. 277 00:13:36,500 --> 00:13:40,780 Epi sa a, ki jan mwen ka konvèti yon tout fisèl miniskil nan JavaScript lè l sèvi avèk 278 00:13:40,780 --> 00:13:42,940 metòd ke yo miniskil. 279 00:13:42,940 --> 00:13:46,570 Paske lè m 'mete yon koulè, jan mwen ap eseye fè isit la, 280 00:13:46,570 --> 00:13:48,260 koulè a ​​gen yo dwe tout miniskil. 281 00:13:48,260 --> 00:13:50,920 >> Men, bouton an ke mwen te gen, si nou pran yon lòt gade, 282 00:13:50,920 --> 00:13:55,890 remake ke tèks la gen ekri ak yon P kapital pou koulè wouj violèt. 283 00:13:55,890 --> 00:13:59,140 Trè an Lè sa a, nan anba isit la, mwen aparamman 284 00:13:59,140 --> 00:14:02,630 eseye ak fè sa lè l sèvi avèk jQuery kòm byen. 285 00:14:02,630 --> 00:14:06,000 Ak nan ka sa a, mwen se pa aktyèlman rele yon fonksyon nan tout. 286 00:14:06,000 --> 00:14:11,430 Mwen te jis te di klas la ke mwen se lè l sèvi avèk pou bouton sa a se yon bouton JQ. 287 00:14:11,430 --> 00:14:12,360 Sa a li. 288 00:14:12,360 --> 00:14:14,950 >> Se konsa, kouman jQuery konnen sa m 'ap fè? 289 00:14:14,950 --> 00:14:18,740 Oke, sa a se youn nan avantaj ki genyen koupe dezavantaj nan jQuery. 290 00:14:18,740 --> 00:14:21,560 Li ka pèmèt mwen fè bagay sa yo trè avèk presizyon, men petèt pa 291 00:14:21,560 --> 00:14:22,570 kòm entwitif. 292 00:14:22,570 --> 00:14:25,570 Petèt moun lòt twa fè yon ti jan pi plis sans sa m ap fè a. 293 00:14:25,570 --> 00:14:29,010 Isit la, menm si, sa k ap pase sou? 294 00:14:29,010 --> 00:14:31,940 >> Aparamman, sa ki kreye yon fonksyon anonim 295 00:14:31,940 --> 00:14:36,790 ki charj chak fwa dokiman mwen se pare, se konsa document.ready, 296 00:14:36,790 --> 00:14:38,760 kèk fonksyon ki pral rive. 297 00:14:38,760 --> 00:14:40,490 Fondamantalman, lè se yon dokiman pare? 298 00:14:40,490 --> 00:14:42,310 Li nan lè yo Paj mwen chaje. 299 00:14:42,310 --> 00:14:46,540 >> Se konsa, le pli vit ke yo Paj mwen chaje, la yo fonksyon se toujou pare. 300 00:14:46,540 --> 00:14:54,310 Li di, si yon objè nan kalite jQButton, oswa si gen jQButton klas te klike, 301 00:14:54,310 --> 00:14:55,570 egzekite fonksyon sa a. 302 00:14:55,570 --> 00:14:59,360 Se konsa, isit la nan de fonksyon anonim, youn defini andedan nan lòt la. 303 00:14:59,360 --> 00:15:03,930 >> Se konsa, kontèks tout mwen isit la byen lwen tèlman se paj mwen an 304 00:15:03,930 --> 00:15:06,520 lè li charj li rele fonksyon sa a. 305 00:15:06,520 --> 00:15:09,740 Apre sa, fonksyon sa a ap tann pou yon bouton yo dwe klike. 306 00:15:09,740 --> 00:15:14,490 Apre sa, lè se yon bouton klike, JQ bouton espesyalman se klike, 307 00:15:14,490 --> 00:15:17,150 li rele sa a lòt fonksyon, ki se pral 308 00:15:17,150 --> 00:15:21,250 yo mete background nan koulè nan colorDiv yo dwe 309 00:15:21,250 --> 00:15:25,990 tou sa tèks se nan ant etikèt yo. 310 00:15:25,990 --> 00:15:28,050 >> Sa a se nosyon de ki bouton te klike. 311 00:15:28,050 --> 00:15:31,230 Men, otreman, sa a se sòt de konpòte menm jan ak yon evènman. 312 00:15:31,230 --> 00:15:34,460 Se jis menm jan an mwen ta eksprime sa a nan jQuery. 313 00:15:34,460 --> 00:15:36,790 Yon fwa ankò, li la pwobableman yon anpil plis entimidasyon. 314 00:15:36,790 --> 00:15:40,840 Li pa tankou klè tankou yon bagay tankou event.js, 315 00:15:40,840 --> 00:15:45,080 ki se petèt yon ti jan ti kras pi plis sil, men yon ti jan ti kras mwens 316 00:15:45,080 --> 00:15:46,000 entimidasyon. 317 00:15:46,000 --> 00:15:51,460 >> Men, si nou tounen pòp nan men navigatè m ' fenèt, si mwen kòmanse clicking-- byen, 318 00:15:51,460 --> 00:15:52,690 ki chanje a koulè wouj violèt. 319 00:15:52,690 --> 00:15:54,450 Sa a se lè l sèvi avèk metòd la vèt fisèl. 320 00:15:54,450 --> 00:15:56,500 Sa a se lè l sèvi avèk zoranj kap okipe-a evènman. 321 00:15:56,500 --> 00:15:58,300 >> Sa a se lè l sèvi avèk jQuery wouj, dwa? 322 00:15:58,300 --> 00:16:01,270 Yo tout konpòte egzakteman menm bagay la. 323 00:16:01,270 --> 00:16:06,509 Yo jis fè l 'lè l sèvi avèk diferan apwòch yo rezoud pwoblèm nan. 324 00:16:06,509 --> 00:16:08,550 Genyen yon anpil plis nan jQuery Lè sa a, nou ap sètènman 325 00:16:08,550 --> 00:16:10,050 pwal pale osijè nan videyo sa a. 326 00:16:10,050 --> 00:16:15,410 Men, si ou vle aprann plis, ou kapab ale nan sòt nan jQuery nan dokiman 327 00:16:15,410 --> 00:16:19,710 ak aprann byen yon ti jan plis sou sa a bibliyotèk fleksib anpil, ki 328 00:16:19,710 --> 00:16:22,550 se gwo pou fè bò kliyan scripting tankou sa nou te fè 329 00:16:22,550 --> 00:16:26,240 yo manipile gade nan epi yo santi nan paj wèb nou an 330 00:16:26,240 --> 00:16:28,750 ak Dokiman objè ki gen konpòtman egzanplè a. 331 00:16:28,750 --> 00:16:29,650 Mwen se Doug Lloyd. 332 00:16:29,650 --> 00:16:31,930 Sa a se CS50. 333 00:16:31,930 --> 00:16:34,022