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

2
00:00:04,439 --> 00:00:07,230
ڈوگ لایڈ: اس ویڈیو میں، ہم چاہتے تھے
علیحدہ توجہ باہر فون کرنے کے لئے

3
00:00:07,230 --> 00:00:09,110
ایک بہت خاص طور پر
جاوا اسکرپٹ کا عنصر

4
00:00:09,110 --> 00:00:11,350
آپ کو آسان تلاش کر سکتے ہیں کہ
جب آپ شروع کر رہے ہیں

5
00:00:11,350 --> 00:00:15,750
ویب صفحات توڑ پر کام کرنے کے لئے اور
آپ کے ویب صفحے کے مواد کو تبدیل کرنے

6
00:00:15,750 --> 00:00:16,460
مکھی پر.

7
00:00:16,460 --> 00:00:19,450
اور اس کے تصور ہے
دستاویز آبجیکٹ ماڈل.

8
00:00:19,450 --> 00:00:23,030
تو کے طور پر ہم پر ہمارے ویڈیو میں دیکھا
جاوا، اشیاء بہت لچکدار ہیں.

9
00:00:23,030 --> 00:00:24,750
>> اور انہوں نے مختلف شعبوں پر مشتمل ہوسکتا ہے.

10
00:00:24,750 --> 00:00:28,075
اور ہم ایک بہت میں جانا نہیں تھا اگرچہ
تفصیل، ان شعبوں یا خصوصیات،

11
00:00:28,075 --> 00:00:30,200
کہ ہم شاید زیادہ کرے گا
مناسب طریقے سے ان کو بلاؤ

12
00:00:30,200 --> 00:00:33,915
یہاں تک کہ ایک چیز کے تناظر میں
ان کی خصوصیات دیگر اشیاء کیا جا سکتا ہے.

13
00:00:33,915 --> 00:00:36,210
اور ان اشیاء کے اندر
دیگر اشیاء کیا جا سکتا ہے.

14
00:00:36,210 --> 00:00:39,630
>> آپ کو اس بہت بڑی چیز ہے
دیگر اشیاء کی ایک بہت کے ساتھ

15
00:00:39,630 --> 00:00:43,550
کے اس کے اندر، جس طرح
ایک بڑے درخت کے اس خیال کی تخلیق.

16
00:00:43,550 --> 00:00:47,540
اب، دستاویز آبجیکٹ ہے
جاوا اسکرپٹ میں بہت ہی خاص چیز

17
00:00:47,540 --> 00:00:52,580
کہ آپ پورے ویب منظم
چھتری کے تحت اس طرح صفحے

18
00:00:52,580 --> 00:00:53,470
کسی چیز کا.

19
00:00:53,470 --> 00:00:56,770
اور اس دستاویز کے اندر
اعتراض پیش اشیاء ہیں

20
00:00:56,770 --> 00:00:59,630
آپ کے ویب کے صفحے کے سر اور جسم.

21
00:00:59,630 --> 00:01:03,760
>> ان کے اندر دوسرے ہیں
اشیاء، وغیرہ، وغیرہ،

22
00:01:03,760 --> 00:01:08,411
اپنے پورے ویب صفحہ ہے جب تک
اس بڑے اعتراض میں منعقد کی گئی.

23
00:01:08,411 --> 00:01:09,660
الٹا حق، یہاں کیا ہے؟

24
00:01:09,660 --> 00:01:12,170
ٹھیک ہے، ہم کام کرنے کے لئے کس طرح جانتے ہیں
جاوا اسکرپٹ میں اشیاء کے ساتھ.

25
00:01:12,170 --> 00:01:15,840
>> ہم ایک چیز ہے اگر ایسا ہے
کہ ہمارے پورے ویب صفحہ سے مراد

26
00:01:15,840 --> 00:01:19,590
صحیح بلا مطلب
طریقوں ہے کہ اعتراض جوڑتوڑ

27
00:01:19,590 --> 00:01:22,360
یا مخصوص تبدیلی
اس کی خصوصیات کی وجہ سے، ہم

28
00:01:22,360 --> 00:01:25,500
کے عناصر کو تبدیل کر سکتے ہیں
ہمارے صفحہ پروگرام

29
00:01:25,500 --> 00:01:30,210
جاوا سکرپٹ کو استعمال بجائے ہونے
ایچ ٹی ایم ایل، کا کہنا ہے کہ، کے ساتھ چیزوں کوڈ.

30
00:01:30,210 --> 00:01:33,760
تو یہاں ایک کی ایک مثال ہے
ویب صفحہ بہت آسان، ٹھیک ہے؟

31
00:01:33,760 --> 00:01:35,850
یہ HTML ٹیگ، ایک سر ہے.

32
00:01:35,850 --> 00:01:37,979
>> کے اندر ایک عنوان، ہیلو دنیا ہے.

33
00:01:37,979 --> 00:01:38,770
پھر میں نے ایک جسم ہے.

34
00:01:38,770 --> 00:01:40,686
ہے کے اندر، میں نے
تین مختلف چیزیں.

35
00:01:40,686 --> 00:01:44,170
میں نے ایک H2 ہیڈر ٹیگ
ایک پیراگراف، اور ایک لنک.

36
00:01:44,170 --> 00:01:45,920
یہ ایک بہت سادہ ویب صفحہ ہے.

37
00:01:45,920 --> 00:01:48,590
>> ٹھیک ہے، کیا ہو سکتا ہے دستاویز
کی طرح اس نظر کے لئے اعتراض کیسے کروں؟

38
00:01:48,590 --> 00:01:50,700
ٹھیک ہے، یہ ایک چھوٹا سا ہے
شاید سب سے پہلے میں ڈراونا.

39
00:01:50,700 --> 00:01:52,510
لیکن یہ واقعی صرف ایک بڑا درخت ہے.

40
00:01:52,510 --> 00:01:54,890
اور اس کی بہت جڑ میں دستاویز ہے.

41
00:01:54,890 --> 00:02:00,030
>> دستاویز ایک اور مثال ہے کے اندر
اپنے صفحے کے HTML کا حوالہ دیتے ہوئے اعتراض.

42
00:02:00,030 --> 00:02:02,660
اور اپنے صفحے کے HTML اس کے تمام ہے.

43
00:02:02,660 --> 00:02:06,900
اور پھر ایچ ٹی ایم ایل کے اندر
اعتراض، میں ایک سر چیز ہے،

44
00:02:06,900 --> 00:02:09,000
جو وہاں سب کچھ سے مراد.

45
00:02:09,000 --> 00:02:11,009
>> اور وہاں کے اندر،
میں ایک عنوان چیز ہے.

46
00:02:11,009 --> 00:02:15,620
اور وہاں کے اندر، میں نے ایک اور ہے
کہ صرف ہیلو دنیا ہے اعتراض.

47
00:02:15,620 --> 00:02:18,020
میں نے اپنے جسم کر سکتے ہیں
اس طرح کی نمائندگی کی.

48
00:02:18,020 --> 00:02:22,850
>> میرے جسم کے اندر، میں ایک H2 ہے
اعتراض اور پیراگراف کے لئے ایک P اعتراض

49
00:02:22,850 --> 00:02:25,270
اور ایک لنک کے طور پر ایک چیز.

50
00:02:25,270 --> 00:02:29,660
اور اس طرح اس پورے تنظیمی ڈھانچے
ایک بڑے درخت کے طور پر نمائندگی کیا جا سکتا ہے

51
00:02:29,660 --> 00:02:31,990
چھوٹے چھوٹے کے بہت سے
چیزیں اس سے باہر آ رہے ہیں.

52
00:02:31,990 --> 00:02:33,740
اب، کورس، جب
ہم، پروگرامنگ کر رہے ہیں

53
00:02:33,740 --> 00:02:35,560
ایک بڑے درخت کی طرح چیزوں کے بارے میں سوچنا نہیں.

54
00:02:35,560 --> 00:02:37,980
ہم اصل کو دیکھنے کے لئے چاہتے ہیں
کوڈ متعلقہ چیزوں.

55
00:02:37,980 --> 00:02:40,790
>> اور خوش قسمتی سے، ہم کر سکتے ہیں
ہمارے ڈویلپر کے اوزار کا استعمال کرتے ہیں

56
00:02:40,790 --> 00:02:46,080
اصل میں ایک نظر لینے کے لئے
اس ویب سائٹ کے دستاویز آبجیکٹ.

57
00:02:46,080 --> 00:02:48,150
اور یہ کرتے ہیں.

58
00:02:48,150 --> 00:02:49,580
تو میں نے ایک براؤزر کے ٹیب کے لئے کھول دیا ہے.

59
00:02:49,580 --> 00:02:51,540
>> اور میں ڈیولپر کے اوزار کھول دیا ہے.

60
00:02:51,540 --> 00:02:54,460
اور جاوا سکرپٹ پر اپنے ویڈیو میں، میں
کنسول نہیں ہے کہ اس کا ذکر

61
00:02:54,460 --> 00:02:56,770
صرف جگہ جہاں
ہم معلومات کو پرنٹ،

62
00:02:56,770 --> 00:02:59,560
یہ بھی ایک جگہ ہے جہاں
ہم ان پٹ کے بارے میں معلومات کر سکتے ہیں.

63
00:02:59,560 --> 00:03:01,380
اس تناظر میں، کیا
میں کہنا ہے کہ جا رہا ہوں

64
00:03:01,380 --> 00:03:05,720
میں واپس حاصل کرنے کے لئے چاہوں گا
دستاویز اشیاء،

65
00:03:05,720 --> 00:03:07,502
تو میں نے اس پر ایک نظر حاصل کرنے شروع کر سکتے ہیں.

66
00:03:07,502 --> 00:03:08,460
تو میں یہ کس طرح کر سکتا ہے؟

67
00:03:08,460 --> 00:03:10,740
ٹھیک ہے، میں کرنا چاہتے ہیں تو
واقعی اچھی طرح سے منظم،

68
00:03:10,740 --> 00:03:16,317
میں console.dir، ڈی میں آر کہنے جا رہا ہوں.
اب، میں صرف پرنٹ کرنے کے لئے console.log کے استعمال

69
00:03:16,317 --> 00:03:17,400
باہر کچھ بہت آسان.

70
00:03:17,400 --> 00:03:20,450
لیکن میں اس کو منظم کرنا چاہتے ہیں تو
پر hierarchically کسی چیز کی طرح،

71
00:03:20,450 --> 00:03:23,800
میں اس طرح کی تشکیل چاہتے ہیں
ایک ڈائریکٹری ڈھانچہ کی طرح.

72
00:03:23,800 --> 00:03:27,400
>> تو میں نے دستاویز console.dir کرنا چاہتے ہیں.

73
00:03:27,400 --> 00:03:28,430
میں درج کریں مارا جا رہا ہوں.

74
00:03:28,430 --> 00:03:32,350
اور حق اس کے نیچے اب،
اور میں، یہاں میں زوم کریں گے

75
00:03:32,350 --> 00:03:36,000
مجھے یہ جواب دستاویز مل گیا ہے
اس کے اگلے تھوڑا تیر کے ساتھ.

76
00:03:36,000 --> 00:03:39,470
اب، میں اس تیر کے نشان کو کھولنے جب،
سامان کی ایک بہت ہو رہا ہے.

77
00:03:39,470 --> 00:03:42,560
>> لیکن ہم نے ایک بہت کو نظر انداز کرنے جا رہے ہیں
یہ اور توجہ صرف کی قسم

78
00:03:42,560 --> 00:03:46,250
سب سے اہم حصہ پر، ہم تو
اس دستاویز کے تالش کا آغاز کر سکتے ہیں.

79
00:03:46,250 --> 00:03:50,125
ڈوم کے مقابلے میں بہت زیادہ نہیں ہے
نوڈس اور بچے نوڈس صرف والدین.

80
00:03:50,125 --> 00:03:51,500
ذیلی سامان کی ایک بہت نہیں ہے.

81
00:03:51,500 --> 00:03:52,280
>> تو میں نے اس کو کھولنے کے لئے جا رہا ہوں.

82
00:03:52,280 --> 00:03:54,610
اور ایک پوری بہت ہے
چیزیں اس ٹمٹمانے.

83
00:03:54,610 --> 00:03:59,000
لیکن میں پرواہ ہے
یہیں، بچے نوڈس.

84
00:03:59,000 --> 00:04:00,410
کی کہ کھول دو.

85
00:04:00,410 --> 00:04:03,810
>> وہاں کے اندر میں دیکھ
واقف کچھ، ایچ ٹی ایم ایل.

86
00:04:03,810 --> 00:04:07,670
ہمارے دستاویز کے اندر تو
ایک سطح نیچے، ایچ ٹی ایم ایل.

87
00:04:07,670 --> 00:04:08,550
میں اس کو کھولنے.

88
00:04:08,550 --> 00:04:10,380
ہم کیا توقع کر رہے ہیں؟

89
00:04:10,380 --> 00:04:13,760
>> اگر آپ کو ہماری آریھ سے یاد تو،
ہم ایچ ٹی ایم ایل کے اندر کیا تلاش کرنا چاہئے؟

90
00:04:13,760 --> 00:04:17,275
درخت میں اس کے نیچے کیا دو مراکز ہیں؟

91
00:04:17,275 --> 00:04:17,899
چلو باہر تلاش.

92
00:04:17,899 --> 00:04:18,940
ہم ایچ ٹی ایم ایل کو کھولنے.

93
00:04:18,940 --> 00:04:22,079
ہم اس بچے نوڈس نیچے جاؤ.

94
00:04:22,079 --> 00:04:23,440
>> کہ کھلی پاپ.

95
00:04:23,440 --> 00:04:25,990
سر اور جسم نہیں ہے.

96
00:04:25,990 --> 00:04:28,540
اور ہم سر کو کھول سکتے ہیں.

97
00:04:28,540 --> 00:04:30,460
اس کے بچے نوڈس پر جائیں.

98
00:04:30,460 --> 00:04:31,460
ویسے، عنوان ہے.

99
00:04:31,460 --> 00:04:33,293
>> اور ہم پر جا سکتے ہیں اور
اس طرح ہمیشہ کے لئے.

100
00:04:33,293 --> 00:04:34,770
ہم ساتھ ساتھ جسم کے ساتھ ایسا کر سکتا ہے.

101
00:04:34,770 --> 00:04:40,090
لیکن ہم کو دیکھنے کے لئے کے لئے ایک طریقہ ہے
ایک بڑا اعتراض کے طور پر منظم دستاویز.

102
00:04:40,090 --> 00:04:42,610
ہم پر نظر ڈالیں تو ایک بڑا ہے
ایک بہت لگ رہا ہے کہ اعتراض

103
00:04:42,610 --> 00:04:47,480
کوڈ کی طرح، کہ ہم شروع کر سکتے ہیں کا مطلب ہے کہ
کا استعمال کرتے ہوئے بڑے اعتراض جوڑتوڑ

104
00:04:47,480 --> 00:04:51,220
کوڈ کیا تبدیل کرنے کے اپنے
ویب سائٹ لگتا ہے اور اس طرح محسوس ہوتا ہے.

105
00:04:51,220 --> 00:04:54,920
>> تو یہ ایک بہت طاقتور آلہ ہے
اب ہم ہمارے اختیار میں ہے.

106
00:04:54,920 --> 00:04:57,360
ہم نے ابھی دیکھا تو کے طور پر،
دستاویز اعتراض خود

107
00:04:57,360 --> 00:05:01,392
اور اس کے اندر اشیاء کی تمام
صرف، خصوصیات اور طریقوں ہے

108
00:05:01,392 --> 00:05:04,100
ہم ہے کہ کسی بھی دوسرے اعتراض کی طرح
جاوا اسکرپٹ میں ساتھ کام کر رہے.

109
00:05:04,100 --> 00:05:08,370
لیکن ہم ان کی خصوصیات استعمال کر سکتے ہیں اور
قسم کے نیچے ڈرل کرنے کے لئے ان طریقوں کا استعمال

110
00:05:08,370 --> 00:05:10,900
اور بڑی دستاویز سے حاصل
کم اور کم اور کم،

111
00:05:10,900 --> 00:05:13,360
ہے finer اور finer اناج
تفصیل کے، ہم جب تک

112
00:05:13,360 --> 00:05:17,510
کی ایک بہت ہی مخصوص ٹکڑا حاصل کرنے کے لئے ہماری
ہم کو تبدیل کرنا چاہتے ہیں کہ ویب کے صفحے.

113
00:05:17,510 --> 00:05:22,700
>> اور ہم کی خصوصیات کو اپ ڈیٹ جب
آبجیکٹ دستاویز یا ان طریقوں کال،

114
00:05:22,700 --> 00:05:24,450
چیزیں ہماری ویب کے صفحے پر ہو سکتا ہے.

115
00:05:24,450 --> 00:05:28,420
اور ہم کسی بھی تازگی ایسا کرنے کی ضرورت نہیں
ان تبدیلیوں کا اثر لینے کے لئے ہے.

116
00:05:28,420 --> 00:05:33,160
>> اور اس کے لئے ایک بہت اچھا صلاحیت ہے
ہم کوڈ کے ساتھ کام کر رہے ہیں جب ہے.

117
00:05:33,160 --> 00:05:37,185
تو ان خصوصیات میں سے کچھ ہیں
ایک دستاویز اعتراض کا حصہ ہیں؟

118
00:05:37,185 --> 00:05:40,100
ویسے، آپ کو شاید دیکھا
ان میں سے جوڑے واقعی فوری طور پر

119
00:05:40,100 --> 00:05:42,700
ہم zipping رہے تھے
وشال دستاویز کے ذریعے

120
00:05:42,700 --> 00:05:45,150
اعتراض ہم صرف ویب براؤزر میں دیکھا.

121
00:05:45,150 --> 00:05:48,420
>> لیکن ان کی خصوصیات میں سے ایک جوڑے
اندرونی HTML کی طرح چیزوں کو ہو سکتا ہے.

122
00:05:48,420 --> 00:05:52,950
اور تم نے مجھے یاد کر سکتے ہیں
جاوا ویڈیو میں اس کا استعمال کرتے ہوئے

123
00:05:52,950 --> 00:05:54,950
آخر میں جب میں
واقعات کے بارے میں بات کر رہا تھا.

124
00:05:54,950 --> 00:05:56,125
اس اندرونی HTML کیا تھا؟

125
00:05:56,125 --> 00:05:59,030
ٹھیک ہے، یہ ہے صرف کیا ہے
ٹیگز کے درمیان میں.

126
00:05:59,030 --> 00:06:01,590
>> اور اس طرح اندرونی HTML،
مثال کے طور پر، عنوان کے

127
00:06:01,590 --> 00:06:05,390
ہم رکھا تھا تو ٹیگ، میں جا
، ایک لمحے پہلے مثال کے طور پر

128
00:06:05,390 --> 00:06:08,020
ہیلو دنیا ہوتا ہے.

129
00:06:08,020 --> 00:06:10,140
یہ ہمارے صفحے کے عنوان تھا.

130
00:06:10,140 --> 00:06:12,370
دیگر خصوصیات
نوڈ کا نام، جس میں شامل ہیں

131
00:06:12,370 --> 00:06:15,810
ایک HTML کا نام ہے
عنوان کے طور پر اس طرح کے عنصر.

132
00:06:15,810 --> 00:06:19,100
ID ہے جس کی شناخت،
ایک HTML عنصر کی خصوصیت.

133
00:06:19,100 --> 00:06:23,790
>> ہم خاص طور پر اس بات کی نشاندہی کر سکتے ہیں یاد
ہمارے HTML کے مخصوص عناصر

134
00:06:23,790 --> 00:06:27,510
جو عام طور پر ایک ID وصف، کے ساتھ
سی ایس ایس کے تناظر میں ہاتھ میں آتا ہے،

135
00:06:27,510 --> 00:06:29,000
خاص طور پر.

136
00:06:29,000 --> 00:06:33,217
کے لئے ایک ریفرنس ہے جس میں والدین کی نوڈ،
ابھی تک میرے اوپر ڈوم میں کیا ہے.

137
00:06:33,217 --> 00:06:35,800
اور بچوں کی گانٹھوں، ہے جس میں ایک
مجھے نیچے نیچے کیا ہے کے حوالے.

138
00:06:35,800 --> 00:06:37,950
اور ہم اس کی ایک بہت دیکھا
صرف کے ذریعے تلاش.

139
00:06:37,950 --> 00:06:42,970
ہم کس طرح بچے نوڈس، ہے
درخت میں کم اور کم.

140
00:06:42,970 --> 00:06:46,590
>> ، صفات ہے کہ صرف ایک صف ہے
کے HTML عنصر کی صفات.

141
00:06:46,590 --> 00:06:50,270
تو صفات کی ایک مثال ہو سکتا ہے
آپ کو ایک تصویر ٹیگ ہے تو ہو،

142
00:06:50,270 --> 00:06:54,090
یہ عام طور پر ایک ذریعہ وصف ہے،
شاید ایک اونچائی اور چوڑائی وصف.

143
00:06:54,090 --> 00:06:57,120
اور تو ہے کہ صرف ایک سرنی ہو جائے گا
منسلک صفات میں سب سے

144
00:06:57,120 --> 00:06:59,300
کہ HTML عنصر کے ساتھ.

145
00:06:59,300 --> 00:07:04,140
>> انداز ایک ہے کہ
سی ایس ایس کی نمائندگی کرتا ہے

146
00:07:04,140 --> 00:07:06,050
ایک خاص عنصر کے اسٹائل.

147
00:07:06,050 --> 00:07:08,310
اور بعد میں اس میں
ویڈیو، ہم خاص طور پر کروں گا

148
00:07:08,310 --> 00:07:14,592
بیعانہ سٹائل کے ایک جوڑے بنانے کے لئے
ہماری ویب سائٹ میں تبدیلی کی.

149
00:07:14,592 --> 00:07:15,800
تو وہ کچھ خصوصیات ہیں.

150
00:07:15,800 --> 00:07:17,591
>> اور بھی کچھ وہاں ہو
ہم کر سکتے ہیں کے طریقوں

151
00:07:17,591 --> 00:07:22,450
بھی زیادہ تیزی سے ہو سکتا ہے کہ الگ تھلگ کرنے کے لئے استعمال
دستاویز آبجیکٹ کے عناصر.

152
00:07:22,450 --> 00:07:26,730
شاید، سب سے زیادہ ورسٹائل
ان ہونے getElementById کی.

153
00:07:26,730 --> 00:07:31,190
تو میں نے، کیونکہ کچھ اس طرح کا کہنا ہے کہ ہو سکتا ہے
اس دستاویز کا ایک طریقہ ہے یاد

154
00:07:31,190 --> 00:07:34,880
، ہیں document.getElementByID آبجیکٹ.

155
00:07:34,880 --> 00:07:39,820
>> اور ان قوسین کے اندر، کی وضاحت
ایک خاص طور پر شناخت کے ساتھ ایک HTML عنصر

156
00:07:39,820 --> 00:07:42,330
میں نے پہلے کیا ہے کہ منسوب
مقرر کریں، اور میں نے فوری طور گے

157
00:07:42,330 --> 00:07:46,685
اس عنصر کا حق جانا
مجموعی طور پر ویب سائٹ کے.

158
00:07:46,685 --> 00:07:49,310
تو میں نے شاید ڈرل کی ضرورت نہیں ہے
ہر ایک پرت کے ذریعے نیچے.

159
00:07:49,310 --> 00:07:52,841
میں نے صرف اسے تلاش کرنے کے لئے یہ طریقہ استعمال کر سکتے ہیں،
قسم کی گرمی تلاش میزائل کی طرح،

160
00:07:52,841 --> 00:07:53,340
ٹھیک ہے؟

161
00:07:53,340 --> 00:07:56,300
یہ صرف جاتا ہے اور پتہ چلا ہے
بالکل اس کے لئے لگ رہا ہے کیا.

162
00:07:56,300 --> 00:07:59,290
>> GetElementsByTagName ہے
روح میں بہت اسی طرح کی.

163
00:07:59,290 --> 00:08:02,500
ہو سکتا ہے کہ اس کے تمام تلاش کریں گے
جرات مندانہ ٹیگز یا P کرنے کے لئے تمام

164
00:08:02,500 --> 00:08:05,920
اور مجھے ہر چیز کا ایک سرنی دے
پھر میں نے ساتھ مل کر کام کر سکتے ہیں کہ.

165
00:08:05,920 --> 00:08:12,080
appendChild کچھ اضافہ کر دیتی ہے
درخت میں ایک سطح.

166
00:08:12,080 --> 00:08:16,440
>> تو میں نے ایک پورے نئے شامل کر سکتے ہیں
عنصر ایک سطح کم.

167
00:08:16,440 --> 00:08:19,700
یا میں ہے کہ ایک عنصر ختم کر سکتے ہیں
کے طور پر اچھی طرح سے میں کرنا چاہتے ہیں تو ایک سطح کم

168
00:08:19,700 --> 00:08:22,870
میری ویب کے صفحے سے کچھ کو خارج کرنا.

169
00:08:22,870 --> 00:08:28,480
اب، ایک فوری کوڈنگ نوٹ اور ایک فوری
سردرد امید، نوٹ محفوظ کر رہا.

170
00:08:28,480 --> 00:08:31,670
>> getElementById-- D خفی ہے.

171
00:08:31,670 --> 00:08:36,950
میں نے کتنی بار آپ کو بتا نہیں کر سکتے ہیں
استعمال کیا جاتا ہے getElementById اور پونجیکرت

172
00:08:36,950 --> 00:08:38,336
وہاں D.

173
00:08:38,336 --> 00:08:39,460
یہ واقعی عام ہے کیونکہ.

174
00:08:39,460 --> 00:08:42,990
ہم لفظ شناخت لکھتے ہیں، یہ ہے
عام طور پر دارالحکومت میں نے دارالحکومت ڈی

175
00:08:42,990 --> 00:08:44,240
اور میرا کوڈ صرف کام نہیں کرتا.

176
00:08:44,240 --> 00:08:45,630
اور مجھے کیوں سمجھ نہیں کر سکتے ہیں.

177
00:08:45,630 --> 00:08:49,490
یہ واقعی، واقعی، واقعی ایک ہے
سب ہے کہ عام مسئلے سے،

178
00:08:49,490 --> 00:08:51,890
ہے کہ یہاں تک کہ ماہرین
ہمیشہ یہ کر رہا.

179
00:08:51,890 --> 00:08:55,410
تو، getElementById واقف ہونا،
کہ ڈی خفی ہے.

180
00:08:55,410 --> 00:09:00,080
اور امید ہے، کہ آپ کو کئی بچاتا ہے
درد دل کے کم از کم منٹ.

181
00:09:00,080 --> 00:09:02,204
>> تو کیا اس کے تمام بتاتی ہے؟

182
00:09:02,204 --> 00:09:03,120
ہم ان طریقوں ہے.

183
00:09:03,120 --> 00:09:04,161
ہم نے ان کی خصوصیات ہیں.

184
00:09:04,161 --> 00:09:06,610
اب، ہم سے شروع تو
دستاویز، دستاویز.

185
00:09:06,610 --> 00:09:10,220
جو کچھ بھی، اب ہم کسی کو حاصل کر سکتے ہیں
ہماری ویب کے صفحے کے ایک ٹکڑا

186
00:09:10,220 --> 00:09:14,870
ہم جاوا سکرپٹ کو استعمال کرنے کے لئے چاہتے ہیں کہ
صرف ان طریقوں کال کر

187
00:09:14,870 --> 00:09:19,940
اور خصوصیات کا فائدہ
ہم مختلف مقامات پر تلاش ہے کہ.

188
00:09:19,940 --> 00:09:24,890
>> یہ، اس wordy حاصل کر سکتے ہیں
ہیں document.getElementByID،

189
00:09:24,890 --> 00:09:28,560
شاید ایک طویل ٹیگ کا نام ہے،
شاید آپ کو بعد میں زیادہ کالز کرتے.

190
00:09:28,560 --> 00:09:31,230
چیزیں تھوڑا سا wordy حاصل کر سکتے ہیں.

191
00:09:31,230 --> 00:09:34,480
اور پروگرامرز کے طور پر، آپ کو ہے کے طور پر
شاید ان ویڈیوز میں سے بہت سے لوگوں میں دیکھا،

192
00:09:34,480 --> 00:09:36,600
ہم wordy چیز کو پسند نہیں کرتے.

193
00:09:36,600 --> 00:09:38,520
>> ہم فوری طور پر کام کرنے کے قابل ہونا چاہتے ہیں.

194
00:09:38,520 --> 00:09:42,640
تو ہم نے ایک زیادہ پسند کرے گا
جامع طریقہ کچھ کہنا.

195
00:09:42,640 --> 00:09:46,270
تو کی طرف جاتا ہے اس طرح
کچھ کے تصور jQuery کے کہا.

196
00:09:46,270 --> 00:09:49,170
اب jQuery جاوا سکرپٹ نہیں ہے.

197
00:09:49,170 --> 00:09:50,350
یہ جاوا سکرپٹ کا حصہ نہیں ہے.

198
00:09:50,350 --> 00:09:54,790
>> یہ لکھا گیا ہے کہ ایک لائبریری ہے
کچھ جاوا سکرپٹ پروگرامرز کی طرف سے

199
00:09:54,790 --> 00:09:57,060
تقریبا 10 سال پہلے.

200
00:09:57,060 --> 00:10:01,300
اور اس مقصد یہ کیا ہے کو آسان بنانے کے لئے ہے
کہا جاتا کلائنٹ سائڈ سکرپٹ، جس

201
00:10:01,300 --> 00:10:04,310
ہم صرف کیا تھے بنیادی طور پر ہے
ڈوم پھیری کے ساتھ کے بارے میں بات.

202
00:10:04,310 --> 00:10:11,090
اگر ایسا ہے تو میں ترمیم کرنے کے لئے کرنا چاہتا تھا
میری ویب کے صفحے کے پس منظر کا رنگ، شاید

203
00:10:11,090 --> 00:10:11,980
ایک مخصوص ڈویژن.

204
00:10:11,980 --> 00:10:15,325
>> یہاں، میں بظاہر ہو رہی ہے
ElementById colorDiv.

205
00:10:15,325 --> 00:10:16,950
اور میں اس کے پس منظر کا رنگ مقرر کرنا چاہتے ہیں.

206
00:10:16,950 --> 00:10:20,720
میں صرف خالص جاوا اسکرپٹ استعمال کر رہا ہوں تو
دستاویز آبجیکٹ ماڈل کا استعمال کرتے ہوئے،

207
00:10:20,720 --> 00:10:23,990
یہ ٹھیک ہے، بہت ساری چیزیں ہے؟
ہیں document.getElementByID

208
00:10:23,990 --> 00:10:25,531
colorDiv.style.backgroundColor سبز =.

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

210
00:10:27,260 --> 00:10:28,050
>> واہ.

211
00:10:28,050 --> 00:10:30,110
کا کہنا ہے کہ ایک بہت تھا.

212
00:10:30,110 --> 00:10:31,720
یہ بہت، ٹائپ کرنے کی ایک بہت ہے.

213
00:10:31,720 --> 00:10:35,760
اور اس طرح jQuery میں، ہم شاید کہہ سکتے ہیں
یہ تھوڑا سا زیادہ concisely کے.

214
00:10:35,760 --> 00:10:39,350
ہونے کی وجہ سے بند کر تجارت شاید تھوڑا ہے
سا اچانک سب سے زیادہ خفیہ،

215
00:10:39,350 --> 00:10:39,850
ٹھیک ہے؟

216
00:10:39,850 --> 00:10:43,580
>> کم از کم جب تک تھوڑا سا زیادہ ہے
ہم کیا کر رہے ہیں کے طور پر وضاحتی.

217
00:10:43,580 --> 00:10:49,947
یہ ڈالر کا نشان، قوسین،
ایک اقتباس، ہیش، colorDiv، ٹھیک ہے؟

218
00:10:49,947 --> 00:10:50,780
اس کا کیا مطلب ہے؟

219
00:10:50,780 --> 00:10:53,640
ٹھیک ہے، یہ صرف بنیادی طور پر ہے
ہیں document.getElementByID colorDiv.

220
00:10:53,640 --> 00:10:58,700
>> لیکن یہ آشلپی کے اس طرح ہے
jQuery استعمال کرتے ہوئے یہ کام کر رہے کی راہ.

221
00:10:58,700 --> 00:11:01,380
صرف اب ایک نظر ڈالیں
مختلف طریقوں کی ایک جوڑے کو

222
00:11:01,380 --> 00:11:04,520
میں اصل میں ہو سکتا ہے کہ
اس دستاویز آبجیکٹ استعمال

223
00:11:04,520 --> 00:11:06,807
ماڈل اپنی ویب سائٹ کے ٹکڑے جوڑتوڑ.

224
00:11:06,807 --> 00:11:09,140
خاص طور پر، ہم جا رہے ہیں
توڑ پر کام کرنے

225
00:11:09,140 --> 00:11:14,090
کسی خاص کے رنگ
ایک ویب صفحے پر ڈویژن، colorDiv،.

226
00:11:14,090 --> 00:11:15,299
تو اس میں ایک نظر ڈالیں.

227
00:11:15,299 --> 00:11:15,798
بالکل ٹھیک.

228
00:11:15,798 --> 00:11:16,700
تو میں نے ایک صفحے پر ہوں.

229
00:11:16,700 --> 00:11:20,750
آپ ڈاؤن لوڈ کرتے وقت یہ test.html کہا جاتا ہے
یہ آپ کو اس کے ساتھ ٹنکر کرنا چاہتے ہیں تو.

230
00:11:20,750 --> 00:11:24,730
اور میں ایک گروپ مل گیا ہے
اس صفحے پر بٹن.

231
00:11:24,730 --> 00:11:27,730
اور میں انفرادی افعال کہہ رہا ہوں
پس منظر کا رنگ، سبز، جامنی رنگ کے،

232
00:11:27,730 --> 00:11:31,330
اورینج، سرخ، نیلے رنگ، ایک تقریب
پس منظر کا رنگ کے لئے، ایونٹ ہینڈلر

233
00:11:31,330 --> 00:11:34,360
پس منظر کا رنگ، اور jQuery استعمال کرنے کے لئے.

234
00:11:34,360 --> 00:11:38,147
میں کس بارے میں بات کر رہا ہوں
جب میں یہ کر رہا ہوں؟

235
00:11:38,147 --> 00:11:39,230
تو ہم بٹن دیکھا ہے.

236
00:11:39,230 --> 00:11:41,521
اب، میں ایک نظر ڈالیں
یہاں منبع کوڈ میں سے کچھ.

237
00:11:41,521 --> 00:11:44,770
ہم test.html ساتھ شروع کریں گے.

238
00:11:44,770 --> 00:11:48,100
پس منظر کے لئے تو انفرادی افعال
رنگ میں یہاں ٹائپ ہے کیا ہے.

239
00:11:48,100 --> 00:11:49,350
مجھے تھوڑا سا سکرال.

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

241
00:11:56,170 --> 00:11:58,820
>> اور تم اس میں محسوس کریں گے
یہ بٹن وضاحت کی گئی ہے

242
00:11:58,820 --> 00:12:03,990
اس بٹن کو کلک کیا جاتا ہے کا کہنا ہے کہ،
جامنی رنگ کی باری تقریب کہتے ہیں.

243
00:12:03,990 --> 00:12:06,670
اس بٹن پر کلک کیا جاتا ہے، بلکہ،
تقریب سبز رنگ کی باری فون،

244
00:12:06,670 --> 00:12:08,710
سرخ باری، اورینج باری، نیلے رنگ تبدیل.

245
00:12:08,710 --> 00:12:11,880
آپ نے شاید یہ ہے کہ اندازہ لگا سکتے ہیں
سب سے بہترین ڈیزائن شاید نہیں ہے

246
00:12:11,880 --> 00:12:12,460
احساس، ٹھیک ہے؟

247
00:12:12,460 --> 00:12:16,490
>> میں کر سکتا ہے تو یہ اچھا ہو گا
ایک سے زیادہ عام نقطہ نظر ہے.

248
00:12:16,490 --> 00:12:19,570
ویسے، سب سے پہلے ہم ایک نظر ڈالیں گے
ان پانچ افعال ہیں کیا

249
00:12:19,570 --> 00:12:24,400
ہیں document.getElementByID
جامنی colorDiv.style.background =،

250
00:12:24,400 --> 00:12:27,250
، سرخ، سبز، اورنج
بالترتیب، اور نیلے رنگ کے.

251
00:12:27,250 --> 00:12:30,930
لہذا، خاص طور پر سب سے بہترین ڈیزائن.

252
00:12:30,930 --> 00:12:33,390
>> بٹن کی اگلی سیٹ
میں لکھا ہے کیا جاتا ہے

253
00:12:33,390 --> 00:12:36,380
نامی ایک تقریب
بظاہر رنگ تبدیل

254
00:12:36,380 --> 00:12:38,960
اس کی دلیل کے طور پر ایک تار کو قبول کرتا ہے.

255
00:12:38,960 --> 00:12:40,290
تو یہ تھوڑا سا بہتر ہے.

256
00:12:40,290 --> 00:12:43,840
سرخ ارغوانی، سبز، اورینج،،
بلیو اب ایک دلیل ہے.

257
00:12:43,840 --> 00:12:46,230
تو میں نے ایک سے زیادہ عام لکھا ہے
کیس جاوا اسکرپٹ تقریب،

258
00:12:46,230 --> 00:12:47,771
جو کچھ اس طرح نظر ہو سکتا ہے.

259
00:12:47,771 --> 00:12:48,680
میں گزر رہا ہوں.

260
00:12:48,680 --> 00:12:52,090
اس فنکشن کو تبدیل رنگ ہے
رنگ نامی ایک دلیل کی توقع.

261
00:12:52,090 --> 00:12:54,970
اور میں مقرر کہہ رہا ہوں
رنگ کے پس منظر کا رنگ.

262
00:12:54,970 --> 00:12:58,390
تو یہاں میں یہاں مل گیا ہے کی نمائندگی کرتا ہے.

263
00:12:58,390 --> 00:12:59,770
تو یہ ایک تھوڑا سا بہتر ہے.

264
00:12:59,770 --> 00:13:02,740
>> لیکن میں کرنے کے قابل ہو سکتا ہے
اس سے بہتر کرتے ہیں.

265
00:13:02,740 --> 00:13:06,140
ہم ایک نظر لینے کے لئے نیچے جاتے ہیں
ایونٹ ہینڈلر کی صورت حال پر،

266
00:13:06,140 --> 00:13:07,860
اب ان تمام کالز ایک ہی نظر آئے.

267
00:13:07,860 --> 00:13:10,340
آپ کے لئے یاد تو ہمارے
ایونٹ handlers پر بحث،

268
00:13:10,340 --> 00:13:15,770
میں جس کے بارے میں کے بارے میں معلومات حاصل کر سکتے ہیں
یہ بٹن پر کلک کیا اور اس کا استعمال کیا گیا تھا.

269
00:13:15,770 --> 00:13:19,560
>> اور اس طرح event.JavaScript میں، میں نے
لکھا تبدیلی کے رنگ تقریب، جس میں

270
00:13:19,560 --> 00:13:21,110
کلک کیا گیا تھا جس کے بٹن باہر کے اعدادوشمار.

271
00:13:21,110 --> 00:13:23,250
یہ ٹرگر اعتراض لائن ہے.

272
00:13:23,250 --> 00:13:25,240
اور پھر یہاں، یہ واقعی wordy ہو جاتا ہے.

273
00:13:25,240 --> 00:13:27,420
لیکن میں کیا کر رہا ہوں میں ہوں ہے
پس منظر مقرر

274
00:13:27,420 --> 00:13:30,340
triggerObject inner.HTML رنگ.

275
00:13:30,340 --> 00:13:34,170
اس میں متن
بٹن ٹیگز کے درمیان.

276
00:13:34,170 --> 00:13:36,500
>> اور پھر میں نے بظاہر ہے
خفی کو قائم کرنے کے لئے.

277
00:13:36,500 --> 00:13:40,780
اور یہ کہ میں ایک پورے تبدیل کر سکتے ہیں کس طرح ہے
سٹرنگ کا استعمال کرتے ہوئے جاوا اسکرپٹ میں چھوٹے سے

278
00:13:40,780 --> 00:13:42,940
اس طریقہ کار کو چھوٹے.

279
00:13:42,940 --> 00:13:46,570
میں ایک رنگ مقرر کیونکہ جب،
میں یہاں کیا کرنے کی کوشش کر رہا ہوں کے طور پر،

280
00:13:46,570 --> 00:13:48,260
رنگ تمام چھوٹے ہونا ضروری ہے.

281
00:13:48,260 --> 00:13:50,920
>> لیکن میں تھا کہ بٹن،
ہم ایک نظر ڈالیں تو،

282
00:13:50,920 --> 00:13:55,890
متن موجود نہیں ہے کہ محسوس کریں
جامنی رنگ کے لئے ایک سرمایہ پی کے ساتھ لکھا.

283
00:13:55,890 --> 00:13:59,140
اور پھر میں بہت
یہاں نیچے، میں بظاہر

284
00:13:59,140 --> 00:14:02,630
کوشش کریں اور اس کے ساتھ ساتھ اس کا استعمال کر کے jQuery کرتے.

285
00:14:02,630 --> 00:14:06,000
اور اس معاملے میں، میں واقعی میں نہیں ہوں
بالکل ایک تقریب کو بلا.

286
00:14:06,000 --> 00:14:11,430
میں صرف میں کلاس ہوں کہ کہا ہے
اس بٹن کے لئے استعمال کرتے ہوئے ایک JQ بٹن ہے.

287
00:14:11,430 --> 00:14:12,360
یہی ہے.

288
00:14:12,360 --> 00:14:14,950
>> تو کس طرح کے jQuery میں کیا کر رہا ہوں معلوم ہے؟

289
00:14:14,950 --> 00:14:18,740
ٹھیک ہے، یہ فوائد میں سے ایک ہے
jQuery کے نقصانات میں کمی.

290
00:14:18,740 --> 00:14:21,560
یہ میرے چیزوں ایسا کرنے کی اجازت کر سکتے ہیں
بہت concisely کے، لیکن شاید نہیں

291
00:14:21,560 --> 00:14:22,570
کے طور پر intuitively پر.

292
00:14:22,570 --> 00:14:25,570
ہو سکتا ہے کہ ان لوگوں کو دوسرے تین بنانے
تھوڑا سا زیادہ کیا کر رہا ہوں محسوس.

293
00:14:25,570 --> 00:14:29,010
یہاں، اگرچہ، کیا چل رہا ہے؟

294
00:14:29,010 --> 00:14:31,940
>> بظاہر، پیدا کرنے
ایک گمنام تقریب

295
00:14:31,940 --> 00:14:36,790
کہ بوجھ جب میری دستاویز
، تو document.ready، تیار ہے

296
00:14:36,790 --> 00:14:38,760
کچھ تقریب ہونے جا رہا ہے.

297
00:14:38,760 --> 00:14:40,490
بنیادی طور پر، جب ایک دستاویز تیار ہے؟

298
00:14:40,490 --> 00:14:42,310
اپنے صفحے بھری ہوئی ہے جب یہ ہے.

299
00:14:42,310 --> 00:14:46,540
>> تو کے طور پر جلد ہی اپنے صفحہ بھری ہوئی ہے کے طور پر،
تقریب مندرجہ ذیل ہمیشہ کے لئے تیار ہے.

300
00:14:46,540 --> 00:14:54,310
یہ کہتے ہیں کہ، تو قسم jQButton کی کسی چیز کو،
یا طبقے jQButton کلک کیا گیا ہے تو،

301
00:14:54,310 --> 00:14:55,570
اس تقریب کو پھانسی.

302
00:14:55,570 --> 00:14:59,360
تو یہاں دونوں کے گمنام افعال ہے،
ایک دوسرے کے اندر بیان کیا.

303
00:14:59,360 --> 00:15:03,930
>> اپنی پوری تناظر تو
یہاں اب تک اپنے صفحے ہے

304
00:15:03,930 --> 00:15:06,520
یہ بوجھ جب اس تقریب بلاتا.

305
00:15:06,520 --> 00:15:09,740
اور یہ تقریب انتظار کر رہا ہے
ایک بٹن کے لئے کلک کیا جائے.

306
00:15:09,740 --> 00:15:14,490
اور ایک بٹن کلک کیا جاتا ہے، JQ
کے بٹن پر کلک کیا جاتا ہے خاص طور پر،

307
00:15:14,490 --> 00:15:17,150
اس دوسرے کالز
تقریب، جس میں جا رہا ہے

308
00:15:17,150 --> 00:15:21,250
پس منظر قائم کرنے کے لئے
colorDiv کے رنگ ہونا

309
00:15:21,250 --> 00:15:25,990
جو بھی متن ٹیگز کے درمیان میں ہے.

310
00:15:25,990 --> 00:15:28,050
>> اس کے تصور ہے
جس کے بٹن کلک کیا گیا تھا.

311
00:15:28,050 --> 00:15:31,230
لیکن دوسری صورت میں، اس طرح کی ہے
ایک تقریب کے لئے اسی طرح برتاؤ.

312
00:15:31,230 --> 00:15:34,460
یہ صرف ایک ہی طریقہ ہے مجھے
jQuery میں اس کا اظہار کرے گا.

313
00:15:34,460 --> 00:15:36,790
ایک بار پھر، یہ شاید ایک
بہت زیادہ دھمکی.

314
00:15:36,790 --> 00:15:40,840
یہ کے طور پر واضح نہیں ہے
event.js کی طرح کچھ،

315
00:15:40,840 --> 00:15:45,080
جو شاید تھوڑا سا زیادہ ہے
شبدبہل، لیکن ایک چھوٹا سا تھوڑا سا کم

316
00:15:45,080 --> 00:15:46,000
دھمکی.

317
00:15:46,000 --> 00:15:51,460
>> لیکن ہم اپنے براؤزر میں واپس پاپ تو
ونڈو، مجھے اچھی طرح سے clicking-- شروع تو،

318
00:15:51,460 --> 00:15:52,690
کہ جامنی رنگ میں تبدیل کر دیا.

319
00:15:52,690 --> 00:15:54,450
یہ سٹرنگ طریقہ استعمال کرتے ہوئے سبز ہے.

320
00:15:54,450 --> 00:15:56,500
اس ایونٹ ہینڈلر استعمال اورینج ہے.

321
00:15:56,500 --> 00:15:58,300
>> یہ درست، jQuery استعمال کرتے ہوئے سرخ ہے؟

322
00:15:58,300 --> 00:16:01,270
وہ سب بالکل ایک ہی برتاؤ.

323
00:16:01,270 --> 00:16:06,509
وہ صرف یہ مختلف استعمال کرتے ہوئے
مسئلہ کو حل کرنے کے نقطہ نظر.

324
00:16:06,509 --> 00:16:08,550
کے لئے بہت زیادہ نہیں ہے
jQuery کی تو ہم یقینی طور پر ہیں

325
00:16:08,550 --> 00:16:10,050
اس ویڈیو کے بارے میں بات کرنے جا رہا.

326
00:16:10,050 --> 00:16:15,410
آپ مزید جاننے کے لئے چاہتے ہیں تو، آپ کر سکتے ہیں
دستاویزات کے jQuery قسم پر جائیں

327
00:16:15,410 --> 00:16:19,710
اور کے بارے میں بہت تھوڑا سا مزید جاننے کے
یہ بہت لچکدار لائبریری، جس

328
00:16:19,710 --> 00:16:22,550
کلائنٹ سائڈ کرنے کے لئے بہت اچھا ہے
اس طرح ہم نے کیا کر رہے تھے کے طور پر سکرپٹ

329
00:16:22,550 --> 00:16:26,240
نظر جوڑتوڑ
اور ہماری ویب صفحے کے محسوس

330
00:16:26,240 --> 00:16:28,750
دستاویز آبجیکٹ ماڈل کے ساتھ.

331
00:16:28,750 --> 00:16:29,650
میں ڈوگ لایڈ ہوں.

332
00:16:29,650 --> 00:16:31,930
یہ CS50 ہے.

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