1
00:00:00,270 --> 00:00:05,870
कुछ वीडियो पहले मैं तत्वों का चयन और फिर उन्हें जोड़ तोड़ की इस अवधारणा की शुरुआत की।

2
00:00:06,120 --> 00:00:14,660
इसलिए हम एक एच 1 या सभी छवि टैग का चयन करें और फिर हम रंग बदल सकते हैं या उन्हें चेतन या जब आप उन पर क्लिक करें उन्हें कुछ करने के लिए कर सकते हैं।

3
00:00:14,670 --> 00:00:18,360
अब तक हम केवल आधा चयन करने और इस वीडियो को कवर किया है।

4
00:00:18,360 --> 00:00:24,090
हम एक बार हम उन्हें चुना है तत्वों में हेरफेर करने के लिए कई मायनों में से कुछ को पेश करने जा रहे हैं।

5
00:00:24,120 --> 00:00:26,760
तो यहाँ चार मुख्य बातें मैं के बारे में बात करना चाहते हैं।

6
00:00:26,970 --> 00:00:29,320
पहले एक है कि हम कैसे एक तत्व शैली बदल सकता है।

7
00:00:29,340 --> 00:00:32,050
हम कैसे यह नीले रंग बनाने के लिए या इसे छिपाने बनाते हैं।

8
00:00:32,070 --> 00:00:34,070
फ़ॉन्ट आकार बदलें।

9
00:00:34,080 --> 00:00:40,920
आगे हम जोड़ने और जावास्क्रिप्ट के साथ वर्गों को हटाने और फिर एक टैग की सामग्री को बदलने के बारे में बात करेंगे।

10
00:00:41,010 --> 00:00:44,490
तो कैसे मैं उदाहरण के लिए एक एच 1 टैग के अंदर पाठ को बदल कर।

11
00:00:44,490 --> 00:00:46,590
और फिर अंत में गुण बदल रहा है।

12
00:00:46,590 --> 00:00:52,040
इसलिए हम एक छवि टैग या एक ए.ए. टैग पर रेफरी पर स्रोत कैसे बदल सकता हूँ।

13
00:00:52,230 --> 00:00:55,260
हम शैली संपत्ति के बारे में बात कर रही द्वारा शुरू करने के लिए जा रहे हैं।

14
00:00:55,260 --> 00:01:11,220
तो जब डोम का निर्माण किया है और एक व्यक्ति नोड बना है या एक वस्तु बना है हर एक तत्व के लिए वहाँ एक संपत्ति कहा जाता है शैली और शैली संपत्ति हर एक CSSA संपत्ति है कि हम तैयार कर सकती है गुण के लिए एक की एक बड़ी वस्तु सैकड़ों है।

15
00:01:11,370 --> 00:01:15,460
इसलिए हम जावास्क्रिप्ट कि तब शैली और तत्व जाना होगा अलग ढंग से लिख सकते हैं।

16
00:01:15,480 --> 00:01:24,730
तो यहाँ मैं अपनी आईडी पर प्रकाश डाला द्वारा एक तत्व का चयन कर रहा हूँ तो यह एक चर बुलाया टैग करने के लिए इसे बचाने के लिए चयन करें और फिर इसे जोड़ तोड़।

17
00:01:24,750 --> 00:01:26,370
और क्या मैं मैं स्थापित कर रहा हूँ कर रहा हूँ।

18
00:01:26,370 --> 00:01:34,190
टैग डॉट शैली डॉट रंग नीले टैग डॉट शैली डॉट सीमा 10 पिक्सल ठोस लाल बराबर हो सकता है।

19
00:01:34,200 --> 00:01:37,830
यह ध्यान रखें कि दाईं ओर एक स्ट्रिंग होना चाहिए महत्वपूर्ण है।

20
00:01:38,280 --> 00:01:43,430
तो भी सी एस एस में हालांकि हम चारों ओर नीले या लगभग 70 पी एक्स उद्धरण खड़ा करने की जरूरत नहीं है।

21
00:01:43,440 --> 00:01:44,730
इस सी एस एस नहीं है।

22
00:01:44,730 --> 00:01:45,720
यह जावास्क्रिप्ट है।

23
00:01:45,720 --> 00:01:48,820
इसलिए हम अभी भी नियमित जावास्क्रिप्ट नियमों का पालन करना पड़ता है।

24
00:01:49,080 --> 00:01:53,550
तो मैं एक सरल वेब पेज सेट अप है कि मैं इन गुणों में से कुछ को प्रदर्शित करने के लिए उपयोग करने के लिए जा रहा हूँ है।

25
00:01:54,240 --> 00:02:00,190
इसलिए इस वेब पेज सुपर सरल सिर्फ एक एच -1 एक है कि पैरा के बजाय पैरा है।

26
00:02:00,200 --> 00:02:05,310
वहाँ एक मजबूत टैग और फिर दो आराध्य Corgi घोला जा सकता है की दो छवियों है।

27
00:02:05,640 --> 00:02:13,770
तो मैं क्या करने जा रहा हूँ कौंसुल करने के लिए जाना है और मैं कुछ का चयन करके शुरू करने की जरूरत है और मैं रंग और इस एच-1 की सीमा को बदलने के लिए जा रहा हूँ।

28
00:02:13,770 --> 00:02:22,800
इसलिए मैं यह चयन करने के लिए की जरूरत है और वहाँ करने के लिए है कि चयनकर्ता एच -1 प्रश्नों एक नए दस्तावेज़ में कई तरीके है।

29
00:02:25,320 --> 00:02:33,030
और फिर मैं तुम्हें एच -1 शैली है जो एक विशाल वस्तु टन और गुण के टन है दिखाने के लिए जा रहा हूँ।

30
00:02:33,600 --> 00:02:41,680
तो मैं एच-1 शैली काले रंग की तरह उनमें से एक को बदलने की कोशिश है कि पीले रंग बनाने के लिए जा रहा हूँ।

31
00:02:42,520 --> 00:02:45,560
और आप इसे तुरंत पीले करने के लिए बदल देख सकता था।

32
00:02:45,570 --> 00:02:54,300
सीमा एच -1 कि शैली है कि सीमा के पांच पिक्सल ठोस गुलाबी करते हैं के बराबर होती है साथ वही बात।

33
00:02:56,100 --> 00:02:56,950
और वहाँ हम चले।

34
00:02:57,210 --> 00:03:01,190
तो ज़ाहिर है अगर हम सिर्फ चाहता था यह एक गुलाबी सीमा के साथ पीले हो।

35
00:03:01,290 --> 00:03:04,910
समय पेज लोड से जावास्क्रिप्ट का उपयोग करने के लिए ऐसा करने का कोई कारण नहीं है।

36
00:03:04,920 --> 00:03:18,670
हम सिर्फ हमारे CSSA फाइल में डाल दिया हम जावास्क्रिप्ट का उपयोग होता है, तो हम इसे पीला कर दिया चाहता था और जब उपयोगकर्ता पाँच सेकंड के लिए पेज पर किया गया है एक गुलाबी सीमा है या यह उपयोगकर्ता के एक विशिष्ट भाग को स्क्रोल जब ऐसा करने के लिए अगर वह चाहता था पेज या उपयोगकर्ता में कुछ पर क्लिक किया।

37
00:03:18,690 --> 00:03:23,450
यह सब के बारे में बातें इंटरैक्टिव बना रही है और हम चाहते हैं कि शीघ्र ही कैसे करना देखेंगे।

38
00:03:24,960 --> 00:03:38,150
खैर शैली संपत्ति का उपयोग कर के बारे में अच्छी बात यह है कि वहाँ निश्चित रूप से एक बेहतर तरीका है, तो आप अपने आप को खोजने की तरह मैं यहाँ क्या कर रहा हूँ और यह एक टैग पर पाँच अलग अलग गुणों को बदलने के लिए एक व्यक्ति तत्व पर फ़ाइलों का एक गुच्छा में हेर-फेर है।

39
00:03:38,460 --> 00:03:40,740
और वहाँ कुछ कारणों से एक बेहतर तरीका है कि वहाँ है।

40
00:03:40,740 --> 00:03:43,350
पहले एक है कि यह बहुत ही सूखी कोड नहीं है।

41
00:03:43,350 --> 00:03:46,740
वहाँ दोहराया बाहर टैग की शैली टैग की शैली का एक बहुत कुछ है।

42
00:03:46,740 --> 00:03:50,670
इससे भी महत्वपूर्ण बात है, हालांकि इस अवधारणा चिंताओं की जुदाई कहा जाता है।

43
00:03:50,820 --> 00:03:57,210
इसलिए चिंताओं की जुदाई इस अवधारणा है कि हमारे एच एम एल आर सी एस जावास्क्रिप्ट नहीं है।

44
00:03:57,210 --> 00:04:00,840
प्रत्येक अपने खुद के छोटे डोमेन के लिए जिम्मेदार हैं और हम इसे नहीं करना चाहती।

45
00:04:00,840 --> 00:04:02,830
हम उन दोनों के बीच विदेशी की एक बहुत कुछ नहीं करना चाहती।

46
00:04:02,850 --> 00:04:12,930
इसलिए इस चित्र में आप देख सकते हैं वहाँ प्रत्येक टीम के साथ जो संरचना है और जावास्क्रिप्ट के बीच विदेशी का एक छोटा सा है, जो कि व्यवहार है कि और फिर आकलन देख प्रस्तुति है।

47
00:04:12,930 --> 00:04:25,840
और वहाँ जावास्क्रिप्ट लेकिन याद रखें कि यह हुआ करता था पहले सी एस एस के साथ आया था कि आप हर एक तत्व में व्यक्तिगत रूप से अपने शैलियों में लिखने के लिए जहाँ हम वास्तव में शैली विशेषता का उपयोग किया था एच HTML के साथ एक छोटे से ओवरलैप है।

48
00:04:26,130 --> 00:04:33,500
उस मामले में हमारी प्रस्तुति में स्टाइल वास्तव में संरचना में बुना गया था और सी एस एस के साथ अब हम उन्हें बाहर अलग कर दिया है।

49
00:04:33,570 --> 00:04:38,710
इसलिए हमारे एचएमओ शुद्ध संरचना है और फिर हमारी सफलता शुद्ध शैली है।

50
00:04:38,880 --> 00:04:52,620
तो क्या जावास्क्रिप्ट में फिट बैठता है कि यह एक पेज के व्यवहार को नियंत्रित करना चाहिए और कभी कभी बातें लग रही है लेकिन कैसे बदल रहा है कि इसका मतलब है सिर्फ जावास्क्रिप्ट अंदर गुणों को बदलने के बजाय वास्तव में जावास्क्रिप्ट में स्टाइल कर रही है।

51
00:04:52,680 --> 00:04:57,530
हम क्या कर सकते हैं उन्हें CSSA फ़ाइल के अंदर पर और बंद कर देते है।

52
00:04:57,570 --> 00:05:08,380
तो पैटर्न वास्तव में आम है कि में से एक यह है कि हम मुख्य आकर्षण की तरह एक CSSA वर्ग को परिभाषित और उस पर प्रकाश डाला कक्षा पांच या छह या फिर भी कई अलग अलग गुण है कि हम बदल रहे हैं होगा।

53
00:05:08,380 --> 00:05:13,210
और फिर हम तो जावास्क्रिप्ट के साथ एक तत्व का चयन और यह है कि प्रकाश डाला वर्ग दे सकते हैं।

54
00:05:13,210 --> 00:05:18,930
इसलिए जावास्क्रिप्ट में एक लाइन के साथ हम एक वर्ग है कि उसके बाद पाँच अलग अलग गुण बदल जाएगा जोड़ सकते हैं।

55
00:05:19,150 --> 00:05:22,660
चलो कैसे इस जावास्क्रिप्ट में लागू किया जाएगा पर एक नज़र रखना।

56
00:05:22,690 --> 00:05:36,200
तो बजाय एक टैग का चयन और फिर बदलती शैली लेकिन रंग नीला हो सकता है और उसके बाद से सीमा ऊपर स्टाइल 10 पिक्सेल ठोस लाल क्या हम बजाय कर सकता है हो सकता है कि कक्षा में एक वर्ग के लिए कुछ भी कहा जा सकता है मिल रहा है।

57
00:05:36,250 --> 00:05:41,940
आम तौर पर आप यह तो दर्शाती क्या वर्ग ऐसा माना जाता है कि कुछ हद तक सार्थक होना चाहते हैं।

58
00:05:42,040 --> 00:05:45,040
यह कुछ ऐसा है कि प्रकाश डाला जा रहा है या यह एक सही जवाब है।

59
00:05:45,040 --> 00:05:49,840
जो भी कारण है कि तुम क्लास आवेदन कर रहे हैं के लिए एक उच्च स्कोर के लिए एक अच्छा नाम के साथ आने की कोशिश कर।

60
00:05:50,170 --> 00:05:57,820
तो यह एक अच्छा नाम नहीं है, लेकिन कुछ वर्ग कुछ वर्ग रंग नीला और सीमा 10 पिक्सेल ठोस लाल होना करने के लिए बदल रहा है।

61
00:05:57,820 --> 00:06:13,790
तब सब मुझे क्या करना है मेरे टैग का चयन करें और फिर कक्षा सूची डॉट को टैग डॉट कुछ वर्ग को जोड़ने और उस पर प्रकाश डाला करने के विचार का एक नया वर्ग इन शैलियों के सभी में कुछ वर्ग बुलाया लागू किया जाएगा के साथ मेरा टैग दे देंगे।

62
00:06:13,810 --> 00:06:16,030
वहाँ कुछ अन्य बातें हम वर्ग की सूची के साथ नहीं कर सकते।

63
00:06:16,270 --> 00:06:30,760
तो इस उदाहरण में मैं तीन तरीकों को जोड़ने के जो हम पहले से ही देखा था जो कि कैसे हम एक वर्ग को हटा दें जो एक वर्ग के नाम लेता जोड़ सकते हैं दिखाने के लिए और यह वर्ग सूची से उस वर्ग के नाम और उसके बाद कक्षा सूची टॉगल जो अत्यंत उपयोगी है निकालता है।

64
00:06:30,760 --> 00:06:31,960
यह एक वर्ग के नाम लेता है।

65
00:06:32,080 --> 00:06:39,270
और अगर दिया तत्व पहले से ही उस वर्ग है यह तो इसे हटा दें, तो तत्व है कि वर्ग तो मैं यह मोड़ पर होगा नहीं है जाएगा।

66
00:06:39,280 --> 00:06:40,550
तो बहुत बहुत उपयोगी है।

67
00:06:40,630 --> 00:06:42,180
हम यह सब समय पर बाद में इस्तेमाल करेंगे।

68
00:06:42,400 --> 00:06:46,990
तो इससे पहले कि मैं यहाँ मेरे उदाहरण के लिए वापस जाने के लिए मुझे आप के लिए है कि प्रदर्शन करते हैं।

69
00:06:46,990 --> 00:06:49,300
मैं वास्तव में एक नए वर्ग को परिभाषित करने के लिए जा रहा हूँ।

70
00:06:49,690 --> 00:07:00,390
तो बजाय एक नया स्टाइल शीट बनाने और एक लिंक मैं सिर्फ सिर्फ समय की खातिर एक शैली टैग का उपयोग करने के लिए जा रहा हूँ का उपयोग कर से।

71
00:07:00,530 --> 00:07:04,140
तो मैं एक वर्ग तो आप सिर्फ यह बड़ा फोन करने के लिए जा रहे हैं परिभाषित करने के लिए जा रहा हूँ।

72
00:07:04,990 --> 00:07:14,670
और मैं क्या करने जा रहा हूँ फ़ॉन्ट आकार बदलने 100 पिक्सल हो सकता है और नारंगी होना करने के लिए रंग बदलने के लिए है।

73
00:07:15,010 --> 00:07:22,540
और फिर अंत की यह पांच पिक्सेल ठोस लाल रंग का एक सीमा दे।

74
00:07:22,960 --> 00:07:24,280
तो मैं उस पर छोड़ देंगे।

75
00:07:24,370 --> 00:07:30,900
अगर मैं अपने पाठ्यक्रम के पेज कुछ भी नहीं बदलता ताज़ा लेकिन जब मैं करना चाहता हूँ कुछ करने के लिए है कि कक्षा लागू है।

76
00:07:30,950 --> 00:07:37,120
इसलिए मैं इस पैरा कि मैं अब तक यह चयन करने की जरूरत क्या करना बड़ा वर्ग है बनाने के लिए जा रहा हूँ।

77
00:07:37,120 --> 00:07:44,900
पैरा दस्तावेज़ कि क्वेरी चयनकर्ता पैरा बराबर होती है।

78
00:07:47,180 --> 00:07:47,820
ठीक।

79
00:07:48,010 --> 00:07:53,130
और हम सिर्फ कक्षा सूची पर एक नज़र लेने के द्वारा शुरू करते हैं और आप देख सकते हैं कि यह खाली है।

80
00:07:53,140 --> 00:07:55,970
इस पैरा के लिए अभी तक कोई सौंपा वर्गों रहे हैं।

81
00:07:56,140 --> 00:08:05,310
तो अगर मैं एक प्रदान करना चाहते हैं मैं सब करने की जरूरत है का कहना है कि पी-डब वर्ग सूची में जोड़ने डॉट और मैं कक्षा बड़ा जोड़ना चाहते है।

82
00:08:06,190 --> 00:08:07,240
और वहाँ हम चले।

83
00:08:07,720 --> 00:08:11,370
तो यह स्वतः अपने स्टाइल शीट से नए परिवर्तन को दर्शाता है।

84
00:08:11,440 --> 00:08:13,540
सभी मुझे करना चाहिए था बड़ा वर्ग को जोड़ने है।

85
00:08:13,780 --> 00:08:18,880
इसलिए उम्मीद है कि आप देख सकते हैं कि यह एक बहुत आसान है और हम जिम्मेदारियों को अलग कर रहे हैं कि।

86
00:08:18,880 --> 00:08:27,610
तो सभी कर रहे हैं कि जावास्क्रिप्ट करता है उस पर या एस एस के एक विशिष्ट भाग के बजाय वास्तव में मैन्युअल व्यक्तिगत गुणों से छेड़छाड़ के बंद हो जाती है।

87
00:08:27,610 --> 00:08:32,120
अब हम सिर्फ हमारी जावास्क्रिप्ट के बजाय संभव के रूप में छोटे रूप में चीजें बदल रहे हैं।

88
00:08:32,470 --> 00:08:45,940
तो अगर मैं इसे निकालना चाहते हैं, यह सब मैं क्या करने की जरूरत है टॉगल बड़ा वर्ग को दूर नहीं वर्गहीन करते हैं और मेरी पसंदीदा एक है जो मैं उल्लेख सुपर उपयोगी है।

89
00:08:45,940 --> 00:08:52,940
तो अगर मैं टॉगल अब सही मारा और दर्ज वहाँ कोई वर्ग सौंपा तो यह वर्ग बड़ा आवंटित जाएगा मारा।

90
00:08:53,320 --> 00:08:56,420
अब बड़ा पहले से ही सौंपा जाता है तो यह इसे हटा देंगे।

91
00:08:56,440 --> 00:09:09,610
तो यह स्पष्ट रूप से नहीं उपयोगी इस मामले विशाल फ़ॉन्ट कक्षा में इस पागल नारंगी बनाने के लिए है, लेकिन हम क्या कर सकते हैं एक सूची करने के लिए की तरह कुछ पर है, अगर हम उपयोगकर्ता उस पर क्लिक करने के लिए ऐसा करने में सक्षम होना चाहता हूँ।

92
00:09:09,880 --> 00:09:11,440
और कहा कि इसे बाहर पार कर जाएगा।

93
00:09:11,650 --> 00:09:15,400
लेकिन वे फिर से क्लिक कर सकते हैं और फिर इसे बाहर uncross होगा या सिर्फ सामान्य करने के लिए वापस जाओ।

94
00:09:15,430 --> 00:09:16,400
यही किया जाएगा।

95
00:09:16,410 --> 00:09:23,700
या फिर हम एक वर्ग टॉगल तो हम एक वर्ग किया कहा हो सकता है और मैं फिर से लागू क्लिक करें द्वारा यह कर सकता है।

96
00:09:23,800 --> 00:09:24,820
इसे हटा दिया गया है।

97
00:09:24,820 --> 00:09:27,000
यही कारण है कि आप टॉगल उपयोग हो सकता है जब की सिर्फ एक उदाहरण है।

98
00:09:27,100 --> 00:09:29,740
लेकिन यह वास्तव में बहुत उपयोगी है।

99
00:09:29,740 --> 00:09:34,090
अंतिम बात मैं कक्षा सूची के बारे में लाने के ऊपर चल जाएगा कि यह तकनीकी रूप से एक सरणी नहीं है।

100
00:09:34,090 --> 00:09:37,840
तो इसका मतलब है कि हम एक वर्ग को जोड़ने के क्रम में एक विज्ञापन का उपयोग किया है।

101
00:09:37,870 --> 00:09:39,900
हम धक्का तरह से कुछ नहीं कर सकते।

102
00:09:40,150 --> 00:09:44,000
तो बस एक छोटी सी टिप्पणी, लेकिन यह पता चला है कि यह तकनीकी रूप से एक सरणी नहीं है महत्वपूर्ण है।

103
00:09:44,470 --> 00:09:48,260
इसलिए हम अपने जावास्क्रिप्ट के माध्यम से शैली से छेड़छाड़ के दो अलग अलग तरीकों को कवर किया।

104
00:09:48,280 --> 00:09:55,340
पहले एक स्वयं इसे एक समय जो इसे ईमानदारी से ठीक है अगर तुम सिर्फ एक या दो बातें कर रहे है पर एक संपत्ति कर रही है।