1
00:00:00,000 --> 00:00:07,440

2
00:00:07,440 --> 00:00:08,180
>> ΤΟΜΑΣ REIMERS: Γεια, σε όλους.

3
00:00:08,180 --> 00:00:09,250
Το όνομά μου είναι Tomas Reimers.

4
00:00:09,250 --> 00:00:10,500
>> MIKE RIZZO: Και είμαι Mike Rizzo.

5
00:00:10,500 --> 00:00:12,990
>> ΤΟΜΑΣ REIMERS: Είμαστε δύο CS50s TS.

6
00:00:12,990 --> 00:00:18,910
Και σήμερα είμαστε οδηγεί ένα σεμινάριο για την
JavaScript και CSS για web εφαρμογές.

7
00:00:18,910 --> 00:00:22,140
Αν θέλετε να ακολουθήσετε μαζί, το
σύνδεση είναι εκεί πέρα.

8
00:00:22,140 --> 00:00:25,190
Και θέλετε να το βάλετε επάνω
σχετικά με την εν συντομία υπολογιστή;

9
00:00:25,190 --> 00:00:27,460
>> Υπάρχει η σύνδεση.

10
00:00:27,460 --> 00:00:30,390
Είναι μια μικρή περιοχή, η οποία έχει δεσμούς με
όλοι οι πόροι θα πάμε να

11
00:00:30,390 --> 00:00:36,490
επισημαίνοντας σας σήμερα και έχει επίσης πολλά
χρήσιμες πληροφορίες γραμμένο από εμάς να

12
00:00:36,490 --> 00:00:39,680
διαβάστε περισσότερα στο βάθος όταν θα πάτε πίσω,
και προσπαθείτε να θυμηθείτε τι

13
00:00:39,680 --> 00:00:42,166
ακριβώς δεν λέμε, ό, τι ήταν
μιλάμε, κ.λπ..

14
00:00:42,166 --> 00:00:43,870
>> MIKE RIZZO: Εντάξει.

15
00:00:43,870 --> 00:00:44,890
Οπότε ας ξεκινήσουμε.

16
00:00:44,890 --> 00:00:45,700
>> ΤΟΜΑΣ REIMERS: Έτσι θέλετε να ξεκινήσετε;

17
00:00:45,700 --> 00:00:45,970
OK.

18
00:00:45,970 --> 00:00:47,170
>> MIKE RIZZO: Ναι.

19
00:00:47,170 --> 00:00:51,730
Έτσι, πρώτα θελήσαμε να ξεκινήσουμε με ένα ευρύ
εικόνα σχετικά με το διαδίκτυο και

20
00:00:51,730 --> 00:00:54,240
τύπους αρχείων κατά το σχεδιασμό ιστοσελίδων.

21
00:00:54,240 --> 00:00:57,550
Ενώ αυτή η παρουσίαση θέλουμε να
μπει σε ένα JavaScript πολλά πολλά

22
00:00:57,550 --> 00:01:00,320
αργότερα, θέλαμε να ξεκινήσουμε με
Απλά, το είδος της, όπως το μάτι ενός πουλιού

23
00:01:00,320 --> 00:01:03,270
από ό, τι μια ιστοσελίδα είναι και πώς
να σκεφτείτε για το σχεδιασμό ενός

24
00:01:03,270 --> 00:01:04,800
ιστοσελίδα για την έναρξη.

25
00:01:04,800 --> 00:01:08,370
>> Έτσι, εσείς, σε αυτό το σημείο - με αυτό
είναι την Παρασκευή το βράδυ - θα πρέπει να έχουν

26
00:01:08,370 --> 00:01:11,000
υπέβαλε χρηματοδότηση CS50 σας
πρόβλημα θέτει.

27
00:01:11,000 --> 00:01:15,260
Ας ελπίσουμε, ότι ήταν μια καλή γεύση
για το τι web προγραμματισμό μπορεί να είναι.

28
00:01:15,260 --> 00:01:18,261
Αλλά εδώ θέλουμε, το είδος του, να δώσει
Σας άλλη γεύση, καθώς και.

29
00:01:18,261 --> 00:01:23,190
>> ΤΟΜΑΣ REIMERS: Έτσι απλά για να ανακεφαλαιώσουμε τι
συμβαίνει, όταν πληκτρολογείτε το URL σας

30
00:01:23,190 --> 00:01:26,650
web browser σας, η διεύθυνση URL παίρνει
κοίταξε στον υπολογιστή.

31
00:01:26,650 --> 00:01:28,590
Και ο υπολογιστής σας συνδέεται
σε έναν άλλο υπολογιστή,

32
00:01:28,590 --> 00:01:29,890
που φιλοξενεί το δικτυακό τόπο.

33
00:01:29,890 --> 00:01:33,150
Εντάξει, έτσι ώστε όταν θα πάτε στο google.com, είστε
συνδεδεμένη σε μία από της Google

34
00:01:33,150 --> 00:01:36,496
υπολογιστών, η οποία έχει την
αρχεία για google.com.

35
00:01:36,496 --> 00:01:38,750
>> Ζητά συνέχεια, για ένα συγκεκριμένο αρχείο.

36
00:01:38,750 --> 00:01:40,020
Έτσι, αν πάτε σε -

37
00:01:40,020 --> 00:01:41,550
Δεν ξέρω -

38
00:01:41,550 --> 00:01:48,170
example.com / index.html ή / test.html,
θα πάμε να ζητήσει

39
00:01:48,170 --> 00:01:49,340
ότι συγκεκριμένο αρχείο.

40
00:01:49,340 --> 00:01:52,780
Και ο web server συμβαίνει
να επιστρέψει σε εσάς.

41
00:01:52,780 --> 00:01:54,910
>> Στη συνέχεια, τη στιγμή που θα περάσουν από αυτό το αρχείο -

42
00:01:54,910 --> 00:01:57,750

43
00:01:57,750 --> 00:01:59,950
τη στιγμή που είστε ο υπολογιστής παίρνει ότι
Αρχείο - πρόκειται να ξεκινήσει

44
00:01:59,950 --> 00:02:00,820
να οικοδομήσουμε μια ιστοσελίδα.

45
00:02:00,820 --> 00:02:03,020
Έτσι τώρα έχει το αρχείο HTML,
το οποίο είναι περίπου όπως το

46
00:02:03,020 --> 00:02:05,170
δομή της ιστοσελίδας.

47
00:02:05,170 --> 00:02:08,620
Το αρχείο HTML θα μπορούσε επίσης αναφορά
CSS αρχεία, τα οποία καθορίζουν την

48
00:02:08,620 --> 00:02:09,889
το ύφος της ιστοσελίδας.

49
00:02:09,889 --> 00:02:12,970
>> Αρχεία JavaScript, το οποίο ορίζει
αλληλεπίδραση με την ιστοσελίδα.

50
00:02:12,970 --> 00:02:15,200
Τα αρχεία εικόνας, τα οποία είναι απλά εικόνες.

51
00:02:15,200 --> 00:02:19,450
Και ενδεχομένως να συνδέονται με άλλα αρχεία HTML,
το οποίο μπορείτε να επισκεφθείτε στη συνέχεια.

52
00:02:19,450 --> 00:02:22,656

53
00:02:22,656 --> 00:02:24,380
>> MIKE RIZZO: Εντάξει, ωραία.

54
00:02:24,380 --> 00:02:28,980
Έτσι, εσείς έχετε όλα, ίσως,
κόπο δημιουργία τοπικών υποδοχής σας

55
00:02:28,980 --> 00:02:30,810
σχετικά με την εικονική μηχανή σας.

56
00:02:30,810 --> 00:02:35,650
Και αυτό ακριβώς, το είδος του, είναι η τοπική
τομέα που φιλοξενεί τον υπολογιστή σας μόνο

57
00:02:35,650 --> 00:02:38,760
για σας σε δική σας διεύθυνση IP.

58
00:02:38,760 --> 00:02:43,300
>> Έτσι, στο πλαίσιο αυτό, τότε μπορείτε να προσθέσετε
σε αυτό τις δικές σας ιστοσελίδες.

59
00:02:43,300 --> 00:02:47,655
Θέλω να πω, σε CS50 Οικονομικών, θα πρέπει να έχετε
προστεθεί μερικές σελίδες HTML, τα οποία είναι,

60
00:02:47,655 --> 00:02:49,410
είδος του, τυλιγμένο με την PHP περιτύλιγμα.

61
00:02:49,410 --> 00:02:54,690
Αλλά τελικά, ποιες σελίδες PHP σας
είχαν έξοδο ήταν HTML.

62
00:02:54,690 --> 00:02:58,210
>> Αλλά σκεφτόμαστε πίσω στην αρχή
του PSET, έπρεπε να οριστεί

63
00:02:58,210 --> 00:03:00,890
τα δικαιώματα για τα πάντα, σωστά;

64
00:03:00,890 --> 00:03:07,270
Έτσι, αυτό ακριβώς βασικά μας επιτρέπει να γνωρίζουμε
ποιος μπορεί να διαβάσει, να γράψει, και, ενδεχομένως,

65
00:03:07,270 --> 00:03:08,730
εκτελέσει κάθε ένα από τα αρχεία.

66
00:03:08,730 --> 00:03:11,870
Έτσι θα πάμε να κάνουμε μια γρήγορη - hm;

67
00:03:11,870 --> 00:03:15,660
>> ΤΟΜΑΣ REIMERS: Έτσι θα πάμε
να κάνει ένα γρήγορο demo.

68
00:03:15,660 --> 00:03:19,560
Έτσι απλά να σας θυμίσω, όταν
συνδεθεί με τον υπολογιστή της Google -

69
00:03:19,560 --> 00:03:20,690
όποιος -

70
00:03:20,690 --> 00:03:24,060
και να ζητήσει για ένα αρχείο, πρώτα τον υπολογιστή
πρέπει να βεβαιωθείτε ότι είστε εξουσιοδοτημένος

71
00:03:24,060 --> 00:03:28,790
πραγματικά να δείτε το αρχείο ή διαβάσει ότι
αρχείο, επειδή δεν μπορείτε απλώς να ρωτήσω

72
00:03:28,790 --> 00:03:30,430
για οποιοδήποτε αρχείο σε αυτόν τον υπολογιστή, έτσι δεν είναι;

73
00:03:30,430 --> 00:03:32,260
Αυτό θα ήταν ένα κίνδυνο για την ασφάλεια.

74
00:03:32,260 --> 00:03:37,020
>> Έτσι, αρχεία σχετικά με τα συστήματα που χρησιμοποιούμε, όπως
αυτή η συσκευή CS50, έχουν τρεις

75
00:03:37,020 --> 00:03:39,200
γενικά οι άνθρωποι που μπορούν να έχουν
δικαιώματα σε κάτι.

76
00:03:39,200 --> 00:03:41,610
Η πρώτη είναι η πραγματική
ιδιοκτήτης του εν λόγω αρχείου.

77
00:03:41,610 --> 00:03:43,820
Η δεύτερη είναι η ομάδα που
ανήκει το αρχείο.

78
00:03:43,820 --> 00:03:46,090
Εμείς δεν πρόκειται να επικεντρωθεί
πάρα πολύ για αυτό.

79
00:03:46,090 --> 00:03:50,010
Και το τελευταίο πράγμα είναι, είδος, όπως η
κόσμο ή όπως όλοι οι άλλοι που είναι

80
00:03:50,010 --> 00:03:54,130
δεν είναι ειδικά για αυτό το αρχείο και δεν
έχουν δικαιώματα ιδιοκτησίας πάνω.

81
00:03:54,130 --> 00:04:05,650
>> Έτσι, αν έχουμε ιδιοκτήτη, την ομάδα,
και τότε ο κόσμος.

82
00:04:05,650 --> 00:04:10,510
Και στη συνέχεια, για κάθε μία από αυτές τις ομάδες, μπορείτε
μπορεί να έχει μία από τις τρεις άδειες,

83
00:04:10,510 --> 00:04:13,010
OK, ή πολλαπλές τους.

84
00:04:13,010 --> 00:04:15,070
Μπορείτε να έχουν δικαιώματα για read.

85
00:04:15,070 --> 00:04:16,560
Μπορείτε να έχετε κατάλληλα δικαιώματα.

86
00:04:16,560 --> 00:04:18,880
Και μπορείτε να έχετε δικαιώματα εκτέλεσης.

87
00:04:18,880 --> 00:04:22,060
>> Έτσι, από την άποψη των πραγματικών τύπους αρχείων, διαβάστε
άδεια είναι σαν να είναι στην πραγματικότητα

88
00:04:22,060 --> 00:04:23,250
τα περιεχόμενα του αρχείου.

89
00:04:23,250 --> 00:04:24,730
Μια σωστή άδεια γράφει
στον εν λόγω φάκελο.

90
00:04:24,730 --> 00:04:28,370
Ένα δικαίωμα εκτέλεσης εκτελεί το
αρχείο όπως κάνετε όταν έχετε ένα από

91
00:04:28,370 --> 00:04:29,620
έργα CS50 σας.

92
00:04:29,620 --> 00:04:32,190

93
00:04:32,190 --> 00:04:38,820
>> Έτσι, όταν σκεφτόμαστε σχετικά με τα αρχεία
όπως όταν πρέπει να διαβάσετε ένα HTML

94
00:04:38,820 --> 00:04:41,790
αρχείο, που πρέπει να είναι ο κόσμος
αναγνώσιμη, έτσι δεν είναι;

95
00:04:41,790 --> 00:04:44,420
Πιθανώς, επίσης, ο ιδιοκτήτης θέλει
να είναι σε θέση να επεξεργαστείτε το αρχείο.

96
00:04:44,420 --> 00:04:46,610
Έτσι, ο ιδιοκτήτης πρόκειται να χρειαστείτε
διαβάζουν και να γράφουν δικαιώματα.

97
00:04:46,610 --> 00:04:48,710
Δεν χρειάζεται πραγματικά να εκτελέσει.

98
00:04:48,710 --> 00:04:50,950
>> Ομάδα, θα πάμε για τη θεραπεία της
ίδιο τον κόσμο για τώρα.

99
00:04:50,950 --> 00:04:54,610
Γι 'αυτό πρέπει δικαιώματα ανάγνωσης.

100
00:04:54,610 --> 00:04:57,310
Αλλά δεν χρειάζεται εγγραφή
ή δικαιώματα εκτέλεσης.

101
00:04:57,310 --> 00:05:01,920
Και τώρα, αν σκεφτούμε πίσω στην πρώην
PSETs, τι αντιλαμβανόμαστε είναι αυτό το είδος

102
00:05:01,920 --> 00:05:03,360
του μοιάζουν με δυαδικό, σωστά;

103
00:05:03,360 --> 00:05:04,210
1 σημαίνει ναι.

104
00:05:04,210 --> 00:05:05,040
0 για όχι.

105
00:05:05,040 --> 00:05:06,870
Και μπορούμε πραγματικά να μεταφράσει
αυτό σε δυαδικό.

106
00:05:06,870 --> 00:05:10,478
>> Έτσι, 110 στο δυαδικό θα είναι 6.

107
00:05:10,478 --> 00:05:13,270
100 θα είναι 4.

108
00:05:13,270 --> 00:05:14,690
Το ίδιο με τον κόσμο.

109
00:05:14,690 --> 00:05:20,846
Έτσι, ο αριθμός που θα πάρετε για το
δικαιώματα για αυτό θα ήταν 644.

110
00:05:20,846 --> 00:05:24,400
>> MIKE RIZZO: Και αν νομίζετε ότι πίσω
όταν chmoded κάτι, πιστεύω

111
00:05:24,400 --> 00:05:28,980
έδωσαν στο πρόβλημα που η
παράδειγμα όπου θα μπορούσατε να κάνετε

112
00:05:28,980 --> 00:05:36,470
κάτι σαν chmod 644
και στη συνέχεια το όνομα του αρχείου.

113
00:05:36,470 --> 00:05:39,980
Το 644, στη συνέχεια, μπορείτε τώρα να δείτε άμεσα
όπου αυτό προέρχεται.

114
00:05:39,980 --> 00:05:42,840
Έτσι, ελπίζουμε ότι κάνει ότι
λίγο πιο σαφής.

115
00:05:42,840 --> 00:05:45,600
>> Και τότε, για λόγους σαφήνειας θα άντρα -

116
00:05:45,600 --> 00:05:48,200
Ω ναι, εδώ είναι και πάλι.

117
00:05:48,200 --> 00:05:53,260
Έτσι, 600 τότε θα είναι απλώς το παράδειγμα
δώσαμε εδώ όπου ο ιδιοκτήτης έχει

118
00:05:53,260 --> 00:05:56,360
διαβάστε και το δεξί δικαιώματα, ενώ η ομάδα
και τον κόσμο δεν έχουν δικαιώματα

119
00:05:56,360 --> 00:05:58,145
την πρόσβαση στο αρχείο.

120
00:05:58,145 --> 00:06:01,500
>> ΤΟΜΑΣ REIMERS: Και τότε έχουμε μια γρήγορη
κατάλογο κοινών δικαιώματα.

121
00:06:01,500 --> 00:06:05,250
Έτσι, καταλόγους, θέλετε
να chmod 711 πραγματικά.

122
00:06:05,250 --> 00:06:08,930
Γρήγορη άκρη - για έναν κατάλογο για να έχουν
εκτελέσιμο άδεια σημαίνει να είναι σε θέση

123
00:06:08,930 --> 00:06:11,680
για να ανοίξετε τον τηλεφωνικό κατάλογο.

124
00:06:11,680 --> 00:06:15,280
Εικόνες, CSS, JavaScript, HTML ανάγκες
644, διότι, ουσιαστικά, τον κόσμο

125
00:06:15,280 --> 00:06:16,400
ανάγκες δικαιώματα ανάγνωσης.

126
00:06:16,400 --> 00:06:20,960
>> Και PHP, το οποίο εσείς έχετε δει
αν και δεν θα πρέπει να μιλάμε γι 'αυτό

127
00:06:20,960 --> 00:06:24,880
αυστηρώς τυπικά chmoded με
άδεια 600 επειδή έχει τρέξει με

128
00:06:24,880 --> 00:06:26,540
τα δικαιώματα του ιδιοκτήτη.

129
00:06:26,540 --> 00:06:27,790
Τουλάχιστον στη συσκευή.

130
00:06:27,790 --> 00:06:30,200

131
00:06:30,200 --> 00:06:36,870
>> MIKE RIZZO: Έτσι, αν δεν το κάνετε συγκεκριμένα
καθορίσετε ποιος τύπος αρχείου

132
00:06:36,870 --> 00:06:39,480
θέλετε να συστήσει στην πράξη
μέχρι αυτή την παρουσίαση -

133
00:06:39,480 --> 00:06:43,490
είχαμε ένα πρόβλημα με αυτό, γιατί
ό, τι δεν έγινε σωστά chmoded -

134
00:06:43,490 --> 00:06:47,550
εσείς πρόκειται να πάρει, το είδος του, ένα
Απαγορεύεται σφάλμα ότι η ιστοσελίδα

135
00:06:47,550 --> 00:06:49,700
δεν έχει στην πραγματικότητα την άδεια
για να αποκτήσετε πρόσβαση σε ό, τι αρχείο

136
00:06:49,700 --> 00:06:51,370
θέλετε να αποκτήσετε πρόσβαση.

137
00:06:51,370 --> 00:06:54,780
Και φυσικά, αυτό μπορεί να καθοριστεί -
όπως στο πρόβλημα που - με την αλλαγή

138
00:06:54,780 --> 00:06:56,405
δικαιώματα κατάλληλα.

139
00:06:56,405 --> 00:06:59,620
>> ΤΟΜΑΣ REIMERS: Και το τελευταίο σχόλιο για
γρήγορα την τοπική ανάπτυξη είναι -

140
00:06:59,620 --> 00:07:02,000
έφερε αυτό, αλλά εμείς απλά ήθελε
να το φέρει επάνω πάλι -

141
00:07:02,000 --> 00:07:06,230
αν σας ρωτήσω για ένα διακομιστή - τόσο τοπικό κεντρικό υπολογιστή,
για παράδειγμα, com ή οτιδήποτε άλλο. -

142
00:07:06,230 --> 00:07:09,170
και δεν καθορίσετε ένα συγκεκριμένο αρχείο,
το αρχείο που ο υπολογιστής σας πρόκειται

143
00:07:09,170 --> 00:07:11,540
να ζητήσει ονομάζεται index.html.

144
00:07:11,540 --> 00:07:12,790
Ή, εάν αυτό δεν υπάρχει, index.php.

145
00:07:12,790 --> 00:07:15,560

146
00:07:15,560 --> 00:07:16,350
>> Cool.

147
00:07:16,350 --> 00:07:19,560
Έτσι, αυτό είναι μόνο μια ανακεφαλαίωση των πάντων,
Ας ελπίσουμε, ότι έχουμε καλύπτονται

148
00:07:19,560 --> 00:07:22,800
ενότητα, και να δίνει διαλέξεις,
και μέχρι στιγμής το CS50.

149
00:07:22,800 --> 00:07:26,110
Και τώρα θα πάμε να αρχίσουμε να μιλάμε
για συγκεκριμένα βιβλιοθήκες.

150
00:07:26,110 --> 00:07:30,270
JavaScript και CSS βιβλιοθήκες
για web εφαρμογές.

151
00:07:30,270 --> 00:07:36,350
>> Έτσι, μια γρήγορη λόγος που έχουμε
βιβλιοθήκες προγραμματισμού -

152
00:07:36,350 --> 00:07:39,000
υπάρχουν πολλά προβλήματα σε
προγραμματισμού, η οποία κρατήσει μέχρι βρεθώ

153
00:07:39,000 --> 00:07:40,570
ξανά, και ξανά, και ξανά.

154
00:07:40,570 --> 00:07:43,870
Μπορείτε να παρατηρήσετε ότι πολλές ιστοσελίδες
πρέπει να μπορούν να έχουν drop down

155
00:07:43,870 --> 00:07:49,100
μενού, για παράδειγμα, ή χρειάζονται την ικανότητα
για να έχουν μια πολύ τυπική κουμπί

156
00:07:49,100 --> 00:07:51,400
στυλ, το οποίο μπορεί να μην είναι
το πιο εύκολο πράγμα.

157
00:07:51,400 --> 00:07:54,670
Τώρα που αρχίζουν να μπει σε HTML,
συνειδητοποιούν ότι τα κουμπιά μπορούν πραγματικά να

158
00:07:54,670 --> 00:07:57,720
εξετάσουμε πολύ άσχημο αν
δεν κάνουν τίποτα.

159
00:07:57,720 --> 00:08:00,830
>> Έτσι, πολλοί άνθρωποι έχουν γράψει
ονομάζονται βιβλιοθήκες.

160
00:08:00,830 --> 00:08:02,990
Και σε αυτό το πλαίσιο, είναι
που ονομάζεται επίσης πλαισίων.

161
00:08:02,990 --> 00:08:04,790
Εμείς πάμε για να χρησιμοποιήσετε το
δύο εναλλακτικά.

162
00:08:04,790 --> 00:08:07,360
Και αυτό που είναι είναι ότι είναι ουσιαστικά
προκατασκευασμένα κομμάτια του κώδικα -

163
00:08:07,360 --> 00:08:09,130
είτε CSS ή JavaScript -

164
00:08:09,130 --> 00:08:13,240
ότι να πάρει πολλά από τα
η ομάδα που έχετε στην κωδικοποίηση.

165
00:08:13,240 --> 00:08:17,290
>> Έτσι προ-καθορίζουν μια δέσμη των κατηγοριών ή
προκαθορίζει ένα σωρό λειτουργίες για

166
00:08:17,290 --> 00:08:20,110
Περίπτωση του JavaScript, το οποίο
μπορείτε να καλέσετε αργότερα.

167
00:08:20,110 --> 00:08:22,690
Και τότε μπορείτε να, το είδος του, να πάρει
πρόσβαση σε αυτόν τον κώδικα, χωρίς

168
00:08:22,690 --> 00:08:23,710
χρειάζεται να κάνετε τίποτα.

169
00:08:23,710 --> 00:08:27,750
Ένα παράδειγμα της βιβλιοθήκης ήταν CS50.H.
Αυτό ήταν μια βιβλιοθήκη που δώσαμε για να σας πίσω

170
00:08:27,750 --> 00:08:32,090
σε μία εβδομάδα, γεγονός που επέτρεψε σε σας για να κάνετε
τα πράγματα όπως ότι GetInt και GetString

171
00:08:32,090 --> 00:08:35,237
χωρίς να χρειάζεται να γράψετε
κάθε κωδικό εαυτό σας.

172
00:08:35,237 --> 00:08:36,179
>> MIKE RIZZO: Εντάξει.

173
00:08:36,179 --> 00:08:40,299
Μέχρι εδώ, όπως ακριβώς θα έπρεπε να περιλαμβάνει
σε μας γ αρχεία το διαφορετικό

174
00:08:40,299 --> 00:08:46,570
βιβλιοθήκες, θα πρέπει επίσης να συμπεριλάβει στην
HTML αρχεία μας διαφορετικές βιβλιοθήκες.

175
00:08:46,570 --> 00:08:50,310
Για παράδειγμα, αν θέλαμε να συμπεριλάβει
από μία συγκεκριμένη βιβλιοθήκη JavaScript εδώ,

176
00:08:50,310 --> 00:08:52,850
ίσως, αυτό που έχουμε γράψει
τους εαυτούς μας, όπως είναι φιλοξενούνται τοπικά

177
00:08:52,850 --> 00:08:56,000
ονομάζεται script.js, εμείς απλά
χρησιμοποιήσετε αυτό το συμβολισμό.

178
00:08:56,000 --> 00:08:59,500
>> Έτσι έχουμε ισούται τύπου script
JavaScript κώδικα ισούται

179
00:08:59,500 --> 00:09:01,260
JavaScript.js.

180
00:09:01,260 --> 00:09:05,190
Και αν νομίζετε ότι πίσω CS50 σας
πρόβλημα χρηματοδότησης που, αν φαινόταν σε

181
00:09:05,190 --> 00:09:09,190
header.php στο φάκελο προτύπων,
θα πρέπει να έχετε δει

182
00:09:09,190 --> 00:09:10,970
ορισμένες από αυτές συμπεριλαμβάνεται.

183
00:09:10,970 --> 00:09:13,250
Έτσι, αυτό το πρώτο - τα σενάρια -

184
00:09:13,250 --> 00:09:16,080
Είναι περιλαμβάνουν μια βιβλιοθήκη JavaScript.

185
00:09:16,080 --> 00:09:18,760
Συμπεριλαμβανομένων μια βιβλιοθήκη CSS είναι
λίγο διαφορετικό.

186
00:09:18,760 --> 00:09:21,430
>> Εδώ, αντί του σεναρίου
ετικέτα θα πρέπει να έχετε την ετικέτα συνδέσμου.

187
00:09:21,430 --> 00:09:27,110
Και στη συνέχεια, ο τύπος CSS κειμένου
είναι λίγο διαφορετική.

188
00:09:27,110 --> 00:09:29,270
Δεν χρειάζεται πάντα να περιλαμβάνει
φύλλο στυλ rel.

189
00:09:29,270 --> 00:09:30,970
Αλλά νομίζω ότι είναι, σε γενικές γραμμές,
ορθών πρακτικών.

190
00:09:30,970 --> 00:09:35,810
>> Και τελικά, η HREF, το οποίο θα
μάλλον είδαμε το ATAGs σας για τη σύνδεση

191
00:09:35,810 --> 00:09:39,440
σε διαφορετικές συνδέσεις απλά διευκρινίζει
η σύνδεση του πού θα βρείτε αυτό.

192
00:09:39,440 --> 00:09:42,250
Για παράδειγμα, αν θέλαμε να συνδέσετε ένα
διαφορετική βιβλιοθήκη - ας πούμε -

193
00:09:42,250 --> 00:09:49,330
που έζησε στο styles.css.

194
00:09:49,330 --> 00:09:54,030
Και θέλαμε να συνδέσει ότι αυτό είναι
που φιλοξενούνται στο διαδίκτυο, θα αντιγράψετε αυτό.

195
00:09:54,030 --> 00:09:58,834
Και στη συνέχεια να το επικολλήσετε σε ό, τι
έχουμε εδώ αντ 'αυτού.

196
00:09:58,834 --> 00:10:01,340
>> ΤΟΜΑΣ REIMERS: Εντάξει, ελπίζω να σας
τα παιδιά είναι ήδη εξοικειωμένοι

197
00:10:01,340 --> 00:10:02,410
με το πώς να συνδέσει CSS.

198
00:10:02,410 --> 00:10:04,000
Θα έπρεπε να το κάνουμε αυτό
το τελευταίο σετ καφέ σας.

199
00:10:04,000 --> 00:10:07,110
JavaScript, κάποιοι από εσάς ίσως
έχουν κάποια εμπειρία με.

200
00:10:07,110 --> 00:10:07,980
Κάποιοι από εσάς μπορεί να μην.

201
00:10:07,980 --> 00:10:12,190
>> Έτσι, για τώρα, γνωρίζουμε ότι ένα αρχείο JavaScript
μοιάζει πολύ με ένα αρχείο CSS σε

202
00:10:12,190 --> 00:10:15,640
η αίσθηση που μπορείτε να συνδέσετε σε αυτό ή
ότι μπορείτε να τη συμπεριλάβετε στο εσωτερικό.

203
00:10:15,640 --> 00:10:17,360
Και σας επιτρέπει να script πράγματα.

204
00:10:17,360 --> 00:10:21,820
Και θα πάμε για να σας καθοδηγήσει μέσα από μια
λίγο αργότερα JavaScript.

205
00:10:21,820 --> 00:10:23,560
>> Έτσι, χρησιμοποιώντας μια βιβλιοθήκη -

206
00:10:23,560 --> 00:10:26,150
τη στιγμή που έχετε περιλαμβάνονται, είναι σαν
απλό όσο κυριολεκτικά καλώντας το

207
00:10:26,150 --> 00:10:29,640
λειτουργιών ή την προσθήκη του
ονόματα τάξη σε αυτό.

208
00:10:29,640 --> 00:10:32,220
Το τελευταίο πράγμα που θέλουμε να μιλήσουμε
για την άποψη της βιβλιοθήκης -

209
00:10:32,220 --> 00:10:34,180
και αυτό είναι κάτι περισσότερο από ένα τεχνικό σημείωμα -

210
00:10:34,180 --> 00:10:35,860
είναι η αδειοδότηση ανοικτού κώδικα.

211
00:10:35,860 --> 00:10:41,550
Έτσι, όταν βρείτε αυτές τις πραγματικές βιβλιοθήκες,
μπορεί να σκέφτεται

212
00:10:41,550 --> 00:10:47,630
ερωτήματα αρέσει είναι εντάξει ότι είμαι απλά
χρησιμοποιώντας τον κωδικό κάποιου άλλου, ειδικά

213
00:10:47,630 --> 00:10:51,970
γιατί αυτό είναι κάτι που πολύ
Σου είπα να μην κάνουμε σε αυτό το μάθημα.

214
00:10:51,970 --> 00:10:55,790
>> Έτσι, στην περίπτωση των αδειών ανοικτού κώδικα,
πολλοί προγραμματιστές -

215
00:10:55,790 --> 00:10:57,540
στιγμή που έχουν γράψει μια βιβλιοθήκη,
τα οποία νομίζουν ότι θα μπορούσε να είναι

216
00:10:57,540 --> 00:10:59,450
χρήσιμο για τους άλλους ανθρώπους -

217
00:10:59,450 --> 00:11:02,420
θα δημοσιεύσει στο διαδίκτυο
και να της δώσει άδεια.

218
00:11:02,420 --> 00:11:06,620
Και μια άδεια βασικά λέει ότι είμαι παρούσα
για τη χορήγηση άδειας σε άλλες

219
00:11:06,620 --> 00:11:11,250
ανθρώπους να χρησιμοποιούν αυτό το κομμάτι του λογισμικού
με την ακόλουθη είδος

220
00:11:11,250 --> 00:11:13,230
διατάξεις.

221
00:11:13,230 --> 00:11:16,100
>> Έχουμε συμπεριλάβει ένα σύνδεσμο σε ένα καλό site για να
σας βοηθήσει να καταλάβετε τις άδειες σε

222
00:11:16,100 --> 00:11:17,720
πεζών τρέχετε σε αυτά.

223
00:11:17,720 --> 00:11:21,680
Κοινές διατάξεις είναι τα πράγματα όπως
είστε ευπρόσδεκτοι να χρησιμοποιήσουν τη βιβλιοθήκη μου, έτσι

224
00:11:21,680 --> 00:11:23,000
αρκεί να μου δώσει πίστωση.

225
00:11:23,000 --> 00:11:25,670
Είστε ευπρόσδεκτοι να χρησιμοποιήσουν τη βιβλιοθήκη μου
εφ 'όσον όταν σπάει

226
00:11:25,670 --> 00:11:26,790
δεν μου φταίει.

227
00:11:26,790 --> 00:11:30,310
Είστε ευπρόσδεκτοι να χρησιμοποιήσουν τη βιβλιοθήκη μου τόσο καιρό
όπως δεν το χρησιμοποιούν για να βγάλουν λεφτά

228
00:11:30,310 --> 00:11:31,910
για τον εαυτό σας.

229
00:11:31,910 --> 00:11:34,130
Αυτά είναι τα είδη των κοινών
διατάξεις.

230
00:11:34,130 --> 00:11:37,780
>> Γι 'αυτό το CS50 τελικό σχέδιο, που
δεν θα πρέπει να είναι εξαιρετικά σημαντικό, διότι

231
00:11:37,780 --> 00:11:41,440
τα έργα που χρησιμοποιούν τα παιδιά σας είναι
μάλλον όχι, το είδος του, που είναι γνωστή.

232
00:11:41,440 --> 00:11:44,170
Αλλά όταν πραγματικά να πάνε έξω στο το
κόσμο και να αρχίσετε να χρησιμοποιείτε τις βιβλιοθήκες, η οποία

233
00:11:44,170 --> 00:11:48,100
μπορεί ή δεν μπορεί να είναι όπως επίσης υλοποιείται ως
μερικές από τις πιο δημοφιλείς είμαστε

234
00:11:48,100 --> 00:11:49,780
πρόκειται να περνάει.

235
00:11:49,780 --> 00:11:53,310
Είναι καλό για να είναι σε θέση να κατανοήσουν
Οι άδειες αυτές και να

236
00:11:53,310 --> 00:11:54,560
καταλαβαίνουν τι σημαίνουν.

237
00:11:54,560 --> 00:11:58,120

238
00:11:58,120 --> 00:11:58,586
Και πηγαίνοντας πίσω.

239
00:11:58,586 --> 00:12:00,960
>> MIKE RIZZO: OK.

240
00:12:00,960 --> 00:12:04,850
Έτσι, τώρα κινείται πάνω παραδείγματα
της πραγματικής CSS.

241
00:12:04,850 --> 00:12:07,770
Σε αυτό το σημείο μέχρι τώρα, ίσως
δεν έχουν αντιμετωπίσει αυτό.

242
00:12:07,770 --> 00:12:10,300
Αλλά μπορεί να έχω συναντήσει σε
καθημερινή ζωή σας, όπου κάτι

243
00:12:10,300 --> 00:12:13,160
ότι φαίνεται ένας τρόπος για ένα πρόγραμμα περιήγησης
μπορεί να μην έχουν την ίδια εμφάνιση

244
00:12:13,160 --> 00:12:14,880
τρόπο σε άλλο πρόγραμμα περιήγησης.

245
00:12:14,880 --> 00:12:17,400
>> Αυτό ονομάζεται το πρόγραμμα περιήγησης του προγράμματος περιήγησης
συμβατότητα.

246
00:12:17,400 --> 00:12:20,780
Και όλο αυτό γίνεται όλο και
περισσότερο από ένα πρόβλημα, ειδικά ως

247
00:12:20,780 --> 00:12:25,260
browsers παίρνουν όλο και περισσότερες ελευθερίες
να εφαρμόσουν τα πράγματα όπως θέλουν.

248
00:12:25,260 --> 00:12:28,440
Έτσι για να ξεπεραστεί αυτό, στην πραγματικότητα δεν υπάρχει
μια μεγάλη βιβλιοθήκη που ονομάζεται Normalize.CSS.

249
00:12:28,440 --> 00:12:32,236

250
00:12:32,236 --> 00:12:33,770
>> ΤΟΜΑΣ REIMERS: Θα περιλαμβάνεται το σύνδεσμο.

251
00:12:33,770 --> 00:12:36,210
Σε αυτό το σημείο, είναι χρήσιμο εάν
έχετε το laptop σας εκεί

252
00:12:36,210 --> 00:12:38,740
κοιτάζοντας το χώρο.

253
00:12:38,740 --> 00:12:42,580
Και δίνουμε αυτό σας το δικαίωμα
τώρα απλώς και μόνο επειδή το τελικό CS50

254
00:12:42,580 --> 00:12:44,370
έργο είναι πραγματικά πρόκειται να
Σας ζητώ να το εφαρμόσει

255
00:12:44,370 --> 00:12:45,860
με παρόμοιο τρόπο και μέσα από προγράμματα περιήγησης.

256
00:12:45,860 --> 00:12:49,250
>> Έτσι απλά για να κρατήσει στο πίσω μέρος της
κεφάλι, αυτή είναι μια θαυμάσια βιβλιοθήκη

257
00:12:49,250 --> 00:12:51,170
επειδή θα πρέπει, είδος,
τυποποίηση πράγματα.

258
00:12:51,170 --> 00:12:54,230
Στο Firefox, κάτι που μπορεί να δείξει
ως ένα pixel προς τα αριστερά.

259
00:12:54,230 --> 00:12:58,390
Και τότε Chrome μπορεί να αποφασίσει ότι στην πραγματικότητα
τι εννοούσε ήταν 10 pixels

260
00:12:58,390 --> 00:12:59,380
προς τα αριστερά.

261
00:12:59,380 --> 00:13:01,030
Και θέλετε να τυποποιήσει αυτό.

262
00:13:01,030 --> 00:13:05,360
Normalize θα κάνουν πραγματικά μια πραγματικά καλή
δουλειά του κάνει βεβαιωθείτε ότι το site σας

263
00:13:05,360 --> 00:13:08,070
φαίνεται το ίδιο σε όλους τους φυλλομετρητές.

264
00:13:08,070 --> 00:13:10,660
>> MIKE RIZZO: Έτσι, αν θέλαμε απλά να
κάντε κλικ στο σύνδεσμο πραγματικά γρήγορα και δείχνουν

265
00:13:10,660 --> 00:13:13,140
σας τι μοιάζει, μπορείτε
μπορείτε να το κατεβάσετε χρησιμοποιώντας το

266
00:13:13,140 --> 00:13:14,670
γίγαντας κουμπί Λήψη.

267
00:13:14,670 --> 00:13:18,520
Ή μπορώ να σας ενθαρρύνω να διαβάσετε περισσότερα γι 'αυτό
πατώντας στο σύνδεσμο στο κάτω

268
00:13:18,520 --> 00:13:19,310
δεξιά γωνία.

269
00:13:19,310 --> 00:13:22,420
>> ΤΟΜΑΣ REIMERS: Και αν όντως
κάντε κλικ στο Διαβάστε Περισσότερα εκεί -

270
00:13:22,420 --> 00:13:24,340
κάντε κλικ στην πηγή επί GitHub -

271
00:13:24,340 --> 00:13:31,720
θα δείτε πραγματικά το open source
άδεια για LICENSE.md εκεί.

272
00:13:31,720 --> 00:13:35,740
Και θα δείτε εδώ είναι το
πολύ δημοφιλές άδεια MIT.

273
00:13:35,740 --> 00:13:38,940
Και πάλι, αν έχετε διαβάσει μέσα από το κείμενο,
θα είστε σε θέση να το βρείτε στην ιστοσελίδα

274
00:13:38,940 --> 00:13:42,550
αναφερόμασταν πριν και είναι σε θέση να
κατανοούν χωρίς να χρειάζεται να διαβάσει

275
00:13:42,550 --> 00:13:45,920
μέσα από την νομική ορολογία.

276
00:13:45,920 --> 00:13:46,850
>> MIKE RIZZO: Εντάξει, ωραία.

277
00:13:46,850 --> 00:13:47,940
Έτσι ώστε να είναι Normalize.

278
00:13:47,940 --> 00:13:49,190
Θέλαμε να σας δώσουμε
ότι πολύ γρήγορα.

279
00:13:49,190 --> 00:13:50,030
Ω, έχετε μια ερώτηση;

280
00:13:50,030 --> 00:13:53,013
>> ΚΟΙΝΟ: Έτσι, όταν το κατεβάσετε,
απλώς ακολουθήστε τον κώδικα που έχουν

281
00:13:53,013 --> 00:13:54,098
κάτω από το κουμπί Download;

282
00:13:54,098 --> 00:13:55,860
>> ΤΟΜΑΣ REIMERS: Ναι, έτσι
όταν κάνετε λήψη -

283
00:13:55,860 --> 00:13:58,130
>> MIKE RIZZO: Ω, αυτό είναι ένα μεγάλο σημείο.

284
00:13:58,130 --> 00:14:00,700
Έτσι, το ερώτημα ήταν πώς
μπορούμε να το κατεβάσετε στην πραγματικότητα;

285
00:14:00,700 --> 00:14:03,260
Έτσι, αν κάνουμε κλικ στο σύνδεσμο, βλέπουμε
ότι το σκάει στην πραγματικότητα μέχρι

286
00:14:03,260 --> 00:14:05,030
τον πηγαίο κώδικα.

287
00:14:05,030 --> 00:14:08,550
Έτσι, για να γίνει αυτό, ό, τι μπορούσαμε
Δεν είναι απλά κάντε κλικ στο κουμπί Αποθήκευση ως.

288
00:14:08,550 --> 00:14:10,830
Αποθήκευση ως και ότι θα πρέπει να
να εμφανιστεί ένα αρχείο.

289
00:14:10,830 --> 00:14:14,160
Και τότε μπορούμε να επιλέξουμε να αποθηκεύσετε
ως normalize.CSS.

290
00:14:14,160 --> 00:14:15,810
Και τότε θα πρέπει να το συνδέσετε σε -

291
00:14:15,810 --> 00:14:18,660
>> ΤΟΜΑΣ REIMERS: Με τον ίδιο τρόπο μπορείτε
συνδεθούν σε οποιοδήποτε άλλο αρχείο.

292
00:14:18,660 --> 00:14:22,250
Και τη στιγμή που θα συνδέσετε το, τι είναι μεγάλη
για Normalize είναι ότι θα πραγματικότητα

293
00:14:22,250 --> 00:14:25,920
φροντίσει για όλη τη σκληρή
λειτουργήσει από μόνη της.

294
00:14:25,920 --> 00:14:27,730
Αυτό σημαίνει ότι δεν έχετε
για να προσθέσετε οποιεσδήποτε κατηγορίες.

295
00:14:27,730 --> 00:14:29,690
>> Δεν χρειάζεται να κάνετε τίποτα παράξενο.

296
00:14:29,690 --> 00:14:34,590
Θα ομαλοποιήσει χωρίς εσένα
να κάνει τίποτα περισσότερο.

297
00:14:34,590 --> 00:14:36,083
Ναι, πρέπει να το συμπεριλάβει.

298
00:14:36,083 --> 00:14:38,990

299
00:14:38,990 --> 00:14:40,240
Το Google Chrome δεν ανταποκρίνεται.

300
00:14:40,240 --> 00:14:43,270

301
00:14:43,270 --> 00:14:44,860
>> Απλά μια γρήγορη άκρη -

302
00:14:44,860 --> 00:14:46,800
Παρατήρησα ότι πήδηξε σε αυτό.

303
00:14:46,800 --> 00:14:49,010
Το υπόλοιπο αυτής της παρουσίασης είναι
πρόκειται να είναι μια γρήγορη επισκόπηση.

304
00:14:49,010 --> 00:14:50,380
Μια έρευνα των βιβλιοθηκών.

305
00:14:50,380 --> 00:14:52,710
>> Βασικά, αυτό που είναι.

306
00:14:52,710 --> 00:14:53,350
Αυτό που κάνουν.

307
00:14:53,350 --> 00:14:54,060
Πώς αυτές είναι χρήσιμες.

308
00:14:54,060 --> 00:14:56,540
Πώς μπορείτε να τα εφαρμόσουν.

309
00:14:56,540 --> 00:14:59,730
Αν θέλετε να αρχίσετε να ψάχνετε σε αυτούς,
μετά μαζί, και μέσα από την ανάγνωση

310
00:14:59,730 --> 00:15:01,990
τους, θα ήθελα να ενθαρρύνω ιδιαίτερα αυτό.

311
00:15:01,990 --> 00:15:07,620
>> Εναλλακτικά, είστε ευπρόσδεκτοι να
ξεκινήσετε τη λήψη και να συμπεριληφθούν

312
00:15:07,620 --> 00:15:11,400
τους σε ένα θέαμα για να δει ακριβώς τι
μοιάζουν ή τι κάνουν, αν έχετε

313
00:15:11,400 --> 00:15:12,270
το laptop σας μπροστά σας.

314
00:15:12,270 --> 00:15:14,650
Αν όχι, είστε ευπρόσδεκτοι να κρατήσετε
ακούγοντας να μας μιλήσει.

315
00:15:14,650 --> 00:15:15,500
Εμείς πάμε για να συνεχίσετε να μιλάτε.

316
00:15:15,500 --> 00:15:18,680
Και έχουμε το χρόνο, στο τέλος, ελπίζω
θα πάρετε πραγματικά σε δείχνοντάς σας

317
00:15:18,680 --> 00:15:20,946
τι είναι μερικές από αυτές τις βιβλιοθήκες
μοιάζουν.

318
00:15:20,946 --> 00:15:22,320
>> MIKE RIZZO: Cool.

319
00:15:22,320 --> 00:15:25,466
Εντάξει, τώρα ας μιλήσουμε
σχετικά με Font Awesome.

320
00:15:25,466 --> 00:15:30,480
>> ΤΟΜΑΣ REIMERS: τόσο γραμματοσειράς Awesome είναι ένα
πραγματικά τακτοποιημένο χώρο, ειδικά για εκείνους

321
00:15:30,480 --> 00:15:32,450
από εμάς που είναι λιγότερο καλλιτεχνικά
ταλαντούχος.

322
00:15:32,450 --> 00:15:36,330

323
00:15:36,330 --> 00:15:38,880
Αγνοώντας το όνομα γραμματοσειράς Awesome, δίνει
Είστε ένα μάτσο εικόνες, οι οποίες είναι

324
00:15:38,880 --> 00:15:41,050
πολύ χρήσιμο.

325
00:15:41,050 --> 00:15:45,950
Έτσι, πολλές φορές θα εφαρμόσει ένα
εικονίδιο που μπορεί να θέλετε, όπως ένα ωραίο x έτσι

326
00:15:45,950 --> 00:15:47,170
ώστε να μπορείτε να κλείσετε κάτι.

327
00:15:47,170 --> 00:15:49,910
>> Ή μπορεί να θέλετε κάποια κουμπί Επεξεργασία
με ένα μολύβι, όπως

328
00:15:49,910 --> 00:15:50,940
όλοι οι άλλοι.

329
00:15:50,940 --> 00:15:53,850
Και αυτό είναι, όταν θα μάθετε ότι
κατάρτιση αυτών των εικόνων μπορεί να είναι

330
00:15:53,850 --> 00:15:55,510
πολύ κουραστική και δύσκολη.

331
00:15:55,510 --> 00:15:59,160
Font Awesome - αν πραγματικά
πηγαίνετε στην ιστοσελίδα -

332
00:15:59,160 --> 00:16:02,892
σας δίνει πολλά εικονίδια κάτω
τα εικονίδια στην κορυφή.

333
00:16:02,892 --> 00:16:06,980
Ναι, μόνο η κορυφή.

334
00:16:06,980 --> 00:16:09,030
Θα σας δώσει μια πολύ
εικονίδια για δωρεάν.

335
00:16:09,030 --> 00:16:15,210
>> Έτσι, εδώ θα δείτε έχουμε πράγματα όπως ένα
αστερίσκο, μπαρ, κεραυνό, μια

336
00:16:15,210 --> 00:16:19,750
ημερολόγιο, ένα bug, ένα βιβλίο, και τα λοιπά.

337
00:16:19,750 --> 00:16:21,110
Αυτό μπορεί να είναι πολύ χρήσιμη.

338
00:16:21,110 --> 00:16:24,290
Ο τρόπος που περιλαμβάνουν αυτό είναι που περιλαμβάνουν
κυριολεκτικά το αρχείο CSS.

339
00:16:24,290 --> 00:16:29,760
Και αφού έχετε συμπεριλάβει το αρχείο CSS,
τι μπορείτε να κάνετε είναι να δημιουργήσετε ένα

340
00:16:29,760 --> 00:16:33,430
ετικέτα με τίτλο Ι. satands για
εικονίδιο με την τάξη FA

341
00:16:33,430 --> 00:16:34,460
στέκεται για Font Awesome.

342
00:16:34,460 --> 00:16:36,330
Και τότε, ανεξάρτητα από κατηγορία που θέλετε.

343
00:16:36,330 --> 00:16:41,220
>> Έτσι, αν ήθελα μια εικόνα αυτής της συν
τετράγωνο ακριβώς εδώ, θα ήθελα να δώσω

344
00:16:41,220 --> 00:16:43,290
είναι η κατηγορία FA.

345
00:16:43,290 --> 00:16:46,230
Και τότε FA ενωτικό συν πλατεία παύλα.

346
00:16:46,230 --> 00:16:50,325

347
00:16:50,325 --> 00:16:53,710
>> MIKE RIZZO: Cool, OK.

348
00:16:53,710 --> 00:16:56,980
>> ΤΟΜΑΣ REIMERS: Και στη συνέχεια, η τελευταία CSS
βιβλιοθήκη θέλουμε να ξεπεράσουμε είμαστε

349
00:16:56,980 --> 00:16:59,950
προσπαθεί να κρατήσει το ελάχιστο σε CSS
βιβλιοθήκες, επειδή συνειδητοποιούμε το

350
00:16:59,950 --> 00:17:03,660
τίτλος αυτής της παρουσίασης
Είναι JavaScript Βιβλιοθήκες.

351
00:17:03,660 --> 00:17:07,089
Αλλά σκεφτήκαμε ότι μπορούμε, καθώς και
σας παρουσιάσουμε τις άλλες βιβλιοθήκες

352
00:17:07,089 --> 00:17:09,569
ενώ μιλούσαμε για τις βιβλιοθήκες.

353
00:17:09,569 --> 00:17:11,400
>> Είναι το Google Web Fonts.

354
00:17:11,400 --> 00:17:17,040
Και τι έγινε Web γραμματοσειρές σας επιτρέπει
να κάνετε είναι να προσθέσετε γραμματοσειρές στην ιστοσελίδα σας,

355
00:17:17,040 --> 00:17:22,079
το οποίο είναι ένα πραγματικά εύκολος τρόπος για να το κάνει
όμορφη και να διακρίνει τη συσκευή σας

356
00:17:22,079 --> 00:17:24,460
από όλους τους άλλους είναι αν έχει
μια ωραία γραμματοσειρά ή αν έχει μια ωραία

357
00:17:24,460 --> 00:17:27,790
συλλογή των γραμματοσειρών.

358
00:17:27,790 --> 00:17:31,410
Google Web Fonts είναι ωραία αντίθεση με άλλες
βιβλιοθήκες, με την έννοια ότι είναι ένα

359
00:17:31,410 --> 00:17:33,490
πραγματικά κατευθυνόμενη εγκατάσταση.

360
00:17:33,490 --> 00:17:38,680
>> Έτσι, αν ακολουθήσετε το σύνδεσμο, είναι
google.com / γραμματοσειρές, πιστεύω.

361
00:17:38,680 --> 00:17:41,100
Αν ακολουθήσετε αυτό,
να επιλέξετε γραμματοσειρά σας.

362
00:17:41,100 --> 00:17:44,410
Μπορείτε να επιλέξετε στην αριστερή πλευρά από την
πάχος, κλίση, κ.λπ..

363
00:17:44,410 --> 00:17:48,970
Και στη συνέχεια, αφού έχετε επιλέξει ένα,
μπορείτε να κάνετε κλικ γρήγορη χρήση.

364
00:17:48,970 --> 00:17:49,820
Ακριβώς εκεί.

365
00:17:49,820 --> 00:17:51,590
Κάτω δεξιά από το κουτί.

366
00:17:51,590 --> 00:17:54,380

367
00:17:54,380 --> 00:17:56,700
>> Και στη συνέχεια, μετακινηθείτε προς τα κάτω.

368
00:17:56,700 --> 00:17:59,600

369
00:17:59,600 --> 00:18:02,650
Πρώτα απ 'όλα, σας δίνουν την CSS που
πρέπει να συνδέσετε πραγματικά σε αυτό.

370
00:18:02,650 --> 00:18:03,330
Είναι ακριβώς εκεί.

371
00:18:03,330 --> 00:18:05,170
Μπορείτε απλά να αντιγράψετε και να επικολλήσετε ότι μέσα

372
00:18:05,170 --> 00:18:07,250
Και το ωραίο πράγμα για αυτό είναι
στην πραγματικότητα δεν χρειάζεται καν να

373
00:18:07,250 --> 00:18:08,340
κατεβάστε το αρχείο.

374
00:18:08,340 --> 00:18:11,170
>> Τι πρόκειται να κάνουμε είναι να πρόκειται
να συνδεθούν με την έκδοση από αυτό της Google.

375
00:18:11,170 --> 00:18:14,130
Έτσι, πίσω στο τι σημαίνει αυτό.

376
00:18:14,130 --> 00:18:18,270
Αυτό σημαίνει ότι όταν ένας χρήστης
κατεβάζει το αρχείο σας -

377
00:18:18,270 --> 00:18:22,300
λήψεις σελίδα HTML σας - HTML σας
Η σελίδα πρόκειται για αναφορά αυτό το αρχείο.

378
00:18:22,300 --> 00:18:26,790
>> Έτσι, λοιπόν, ο υπολογιστής σας πρόκειται να δούμε,
Ω, είναι φιλοξενείται στο google.com και όχι

379
00:18:26,790 --> 00:18:28,170
από ό, τι στις theirsite.com.

380
00:18:28,170 --> 00:18:30,370
Επιτρέψτε μου να πάω ζητήσει από την Google για αυτό το αρχείο.

381
00:18:30,370 --> 00:18:32,800
Και στη συνέχεια, πρόκειται να συμπεριλάβει
σχεδόν σαν να ήταν ένας

382
00:18:32,800 --> 00:18:35,584
μέρος του το δικό σου site.

383
00:18:35,584 --> 00:18:36,540
>> ΤΟΜΑΣ REIMERS: Cool.

384
00:18:36,540 --> 00:18:40,980
Και τη στιγμή που θα περιλαμβάνει ότι, στη συνέχεια, να
συμπεριλάβετε στο CSS σας, σας δίνει

385
00:18:40,980 --> 00:18:41,830
η πραγματική γραμμή.

386
00:18:41,830 --> 00:18:45,188
Έτσι ώστε να ρυθμίσετε την οικογένεια γραμματοσειράς ιδιοκτησίας
ίση με το όνομα της γραμματοσειράς.

387
00:18:45,188 --> 00:18:47,936

388
00:18:47,936 --> 00:18:50,440
>> MIKE RIZZO: OK.

389
00:18:50,440 --> 00:18:52,220
Γι 'αυτό και μόλις τελειώσει με το CSS.

390
00:18:52,220 --> 00:18:57,230
Και κάποιοι από εσάς ίσως να σκέφτεται, επίσης,
είχαμε κάποια CSS για CS50 Οικονομικών.

391
00:18:57,230 --> 00:19:00,390
Αλλά CSS βιβλιοθήκης ήταν bootstrap.

392
00:19:00,390 --> 00:19:05,190
Είμαστε πραγματικά περιλαμβάνουν Bootstrap λίγο
αργότερα στην JavaScript, διότι με

393
00:19:05,190 --> 00:19:09,660
η βιβλιοθήκη Bootstrap CSS έρχεται επίσης
με πολλή JavaScript ότι

394
00:19:09,660 --> 00:19:12,060
Εκκίνησης ή το Twitter -
ο οποίος έκανε Bootstrap -

395
00:19:12,060 --> 00:19:15,426
χρησιμοποιεί για τη διαχείριση όλων των CSS τους.

396
00:19:15,426 --> 00:19:19,592
>> ΤΟΜΑΣ REIMERS: Υπάρχει κάποιος που έχει τυχόν
ερωτήσεις μέχρι στιγμής για το CSS σε γενικές γραμμές;

397
00:19:19,592 --> 00:19:20,723
Είμαστε καλά;

398
00:19:20,723 --> 00:19:21,216
Awesome.

399
00:19:21,216 --> 00:19:22,495
>> MIKE RIZZO: Awesome.

400
00:19:22,495 --> 00:19:25,136
>> ΤΟΜΑΣ REIMERS: Έτσι κινείται
στους JavaScript.

401
00:19:25,136 --> 00:19:27,900
>> MIKE RIZZO: Έτσι θελήσαμε να μιλήσουμε
jQuery για να αρχίσει με.

402
00:19:27,900 --> 00:19:30,780
Έχει κανείς ακούσει για jQuery
πριν ή το χρησιμοποίησε;

403
00:19:30,780 --> 00:19:32,180
Ναι, ένα ζευγάρι;

404
00:19:32,180 --> 00:19:36,000
Έτσι, αν απλά να συνεργαστεί με μητρική
JavaScript, θα βρείτε τον εαυτό σας

405
00:19:36,000 --> 00:19:41,000
πληκτρολογώντας πολλά μακρά επιλογείς πολλά.

406
00:19:41,000 --> 00:19:44,400
Έτσι τι jQuery που κάνει είναι να παρέχει
ένα ωραίο περιτύλιγμα για την JavaScript

407
00:19:44,400 --> 00:19:48,180
γλώσσα που σας επιτρέπει να επιλέξετε εύκολα
και να χειριστούν διαφορετικά στοιχεία

408
00:19:48,180 --> 00:19:52,470
εντός του μοντέλου αντικειμένου εγγράφου του
ιστοσελίδα ή το DOM, το οποίο πιστεύω ότι

409
00:19:52,470 --> 00:19:54,290
εσείς έχετε ακούσει για το
διάλεξη σε αυτό το σημείο.

410
00:19:54,290 --> 00:19:57,550
>> ΤΟΜΑΣ REIMERS: Εάν δεν έχετε ακούσει
αυτό ή αν δεν έχετε παρακολουθήσει διάλεξη

411
00:19:57,550 --> 00:20:01,870
όμως, το Document Object Model είναι
βασικά πώς είναι τα πράγματα εκπροσωπούνται.

412
00:20:01,870 --> 00:20:05,290
Έτσι HTML είδος μοιάζει με ένα δέντρο
όταν στην πραγματικότητα το σύρει έξω.

413
00:20:05,290 --> 00:20:06,850
Έχετε το στοιχείο HTML στην κορυφή.

414
00:20:06,850 --> 00:20:07,560
Έχετε το κεφάλι και το σώμα.

415
00:20:07,560 --> 00:20:09,500
>> Και στη συνέχεια, στο πλαίσιο που θα
έχουν ό, τι άλλο.

416
00:20:09,500 --> 00:20:10,660
Αυτό αναφέρεται ως το DOM -

417
00:20:10,660 --> 00:20:12,120
Document Object Model.

418
00:20:12,120 --> 00:20:16,090
Έτσι, ένα μοντέλο που αντιπροσωπεύει αντικείμενα σε
το έγγραφο είναι ένας εύκολος τρόπος για να σκεφτεί

419
00:20:16,090 --> 00:20:18,560
γι 'αυτό.

420
00:20:18,560 --> 00:20:22,520
Και ένα από τα μεγάλο πράγμα για jQuery
είναι αυτό που πραγματικά κάνει διέρχονται

421
00:20:22,520 --> 00:20:26,460
ότι και το χειρισμό στοιχεία μέσα
ότι απίστευτα απλή.

422
00:20:26,460 --> 00:20:30,300
>> Τόσο απλό, στην πραγματικότητα, ότι η πλειονότητα των
JavaScript βιβλιοθήκες ή αν όχι το

423
00:20:30,300 --> 00:20:34,200
πλειοψηφία, η συντριπτική πλειοψηφία των αυτά
θα δείτε πραγματικά χρειάζονται, ώστε jQuery

424
00:20:34,200 --> 00:20:37,530
ότι μπορούν να τρέχουν οι ίδιοι απλά
γιατί αν δεν έχετε jQuery, σας

425
00:20:37,530 --> 00:20:40,540
θα χάνουμε πολύ χρόνο προσπαθώντας να
καταλάβω πώς να επιλέξετε ορισμένες

426
00:20:40,540 --> 00:20:43,660
στοιχεία και το πώς να κάνουν άλλα πράγματα.

427
00:20:43,660 --> 00:20:47,950
Και το άλλο μεγάλο πράγμα για jQuery
είναι ότι είναι πολλαπλή browser συμβατό.

428
00:20:47,950 --> 00:20:51,550
>> Έτσι θυμηθείτε πίσω όταν είπαμε ότι
δεν είναι όλα τα προγράμματα περιήγησης να εφαρμόσουν

429
00:20:51,550 --> 00:20:53,100
τα πράγματα με τον ίδιο τρόπο;

430
00:20:53,100 --> 00:20:55,120
Αυτό ισχύει ακόμη και σε JavaScript.

431
00:20:55,120 --> 00:20:58,220
Και ένα από τα μεγάλα πράγματα για jQuery
είναι ότι θα ανιχνεύσει το

432
00:20:58,220 --> 00:21:00,300
πρόγραμμα περιήγησης και να ανιχνεύσει το
κατάλληλη μέθοδο.

433
00:21:00,300 --> 00:21:03,420
>> Έτσι, αν θα πρέπει να επιλέξετε ένα στοιχείο,
Internet Explorer θα μπορούσαμε να πούμε ότι είστε

434
00:21:03,420 --> 00:21:05,770
πρέπει να κάνουν με αυτόν τον τρόπο.

435
00:21:05,770 --> 00:21:08,300
Firefox θα μπορούσε να πει το σωστό
τρόπος είναι με αυτόν τον τρόπο.

436
00:21:08,300 --> 00:21:09,710
jQuery δεν με νοιάζει.

437
00:21:09,710 --> 00:21:12,550
Όταν σας πω jQuery για να επιλέξετε ένα
στοιχείο που θα καταλάβω πώς είναι

438
00:21:12,550 --> 00:21:16,290
πρέπει να το κάνουμε εντός του browser σας, το
χρήστης είναι σήμερα, και στη συνέχεια κάντε

439
00:21:16,290 --> 00:21:18,584
με αυτόν τον τρόπο.

440
00:21:18,584 --> 00:21:22,650
>> MIKE RIZZO: Ας μην μιλήσουμε για
η χρήση του jQuery λίγο.

441
00:21:22,650 --> 00:21:27,670
Ακριβώς όπως PHP, jQuery έχει ιδιαίτερη
αγάπη για το σύμβολο του δολαρίου.

442
00:21:27,670 --> 00:21:30,880
Έτσι, θα διαπιστώσετε ότι κάθε jQuery -

443
00:21:30,880 --> 00:21:32,060
καλά, όχι όλα.

444
00:21:32,060 --> 00:21:35,210
Μπορείτε μερικές φορές μπορεί να αντικαταστήσει το δολάριο
υπογράφουν με την λέξη jQuery.

445
00:21:35,210 --> 00:21:38,980
Αλλά γενικά, μόνο και μόνο επειδή είναι
μικρότερη, κάθε φορά που βλέπετε είναι jQuery

446
00:21:38,980 --> 00:21:41,420
χρησιμοποιείται θα είναι με το σύμβολο του δολαρίου.

447
00:21:41,420 --> 00:21:47,030
>> Έτσι, εδώ είμαστε απλά δείχνει μια αρχή
επιλογέα για ένα στοιχείο στο DOM.

448
00:21:47,030 --> 00:21:52,850
Εδώ, έχουμε το σύμβολο του δολαρίου ακολουθούμενο
από ανοικτές παρενθέσεις και στη συνέχεια αποσπάσματα.

449
00:21:52,850 --> 00:21:56,130
Και μέσα στα εισαγωγικά πάνε επιλογείς μας
για τα διάφορα στοιχεία.

450
00:21:56,130 --> 00:21:59,810
Ακριβώς όπως και στο CSS, χρειαζόμασταν επιλογείς για να
να είναι σε θέση να το ύφος των διαφόρων στοιχείων

451
00:21:59,810 --> 00:22:00,840
μέσα στη σελίδα.

452
00:22:00,840 --> 00:22:06,555
Αυτές οι διαφορετικές επιλογείς μεταφράσει
ακριβώς σε jQuery και JavaScript,

453
00:22:06,555 --> 00:22:07,820
για το μεγαλύτερο μέρος.

454
00:22:07,820 --> 00:22:10,120
>> Έτσι, εδώ έχουμε μια foo τελεία.

455
00:22:10,120 --> 00:22:14,780
Έτσι, αν θυμάστε από διάλεξη,
η τελεία σημαίνει απλά την τάξη.

456
00:22:14,780 --> 00:22:18,850
Έτσι είμαστε επιλέγοντας το στοιχείο
με την κατηγορία foo.

457
00:22:18,850 --> 00:22:22,670
Έτσι, αν πάω μπροστά και να ανοίξει μας
JavaScript κονσόλα εδώ πολύ γρήγορα

458
00:22:22,670 --> 00:22:26,830
απλά να αποδείξει, αν απλά πληκτρολογήστε το
σύμβολο του δολαρίου, βλέπουμε ότι είναι κάποιου

459
00:22:26,830 --> 00:22:28,090
λειτουργία που έρχεται.

460
00:22:28,090 --> 00:22:29,420
Και αυτό είναι ακριβώς που ορίζεται από jQuery.

461
00:22:29,420 --> 00:22:32,120
>> ΤΟΜΑΣ REIMERS: Για όσους από εσάς
άγνωστο, η κονσόλα είναι ένα εργαλείο

462
00:22:32,120 --> 00:22:35,430
εντός Chrome, η οποία σας επιτρέπει να,
βασικά, εκτέλεση JavaScript σχετικά με την

463
00:22:35,430 --> 00:22:36,450
τρέχουσα σελίδα.

464
00:22:36,450 --> 00:22:39,420
Αυτό που θα βρείτε εξαιρετικά χρήσιμο όταν
είστε πραγματικά debugging και

465
00:22:39,420 --> 00:22:42,400
Πρέπει να είναι όπως, ποια είναι η τρέχουσα
αξία κάποιου global μεταβλητή ή ό, τι

466
00:22:42,400 --> 00:22:43,910
είναι κάτι άλλο;

467
00:22:43,910 --> 00:22:47,620
Είναι κάτι σαν GDB, με εξαίρεση
ότι μπορείτε πραγματικά να

468
00:22:47,620 --> 00:22:51,600
χειραγωγήσουν στοιχεία της σελίδας με
σε ένα πολύ πιο εύκολο τρόπο.

469
00:22:51,600 --> 00:22:55,080
Και επίσης δεν το κάνει, ουσιαστικά, ελέγξτε
με σας, πριν κάνει οτιδήποτε.

470
00:22:55,080 --> 00:22:58,660
>> Έτσι, ενώ, GDB θα μπορούσε να είναι όπως, είσαι
βέβαιοι ότι θέλετε να εκτελέσετε το επόμενο βήμα;

471
00:22:58,660 --> 00:22:59,830
Η κονσόλα είναι σε πραγματικό.

472
00:22:59,830 --> 00:23:03,690
Έτσι, όπως η ιστοσελίδα είναι η απόδοση και
κάνει ό, τι κάνει, το

473
00:23:03,690 --> 00:23:05,720
συμβουλίου και τρέχει παράλληλα με αυτήν.

474
00:23:05,720 --> 00:23:08,330
Και μπορείτε να βάλετε τον κωδικό καταλογισμό σε
ότι η κονσόλα, η οποία θα

475
00:23:08,330 --> 00:23:09,260
να τρέξει στη σελίδα.

476
00:23:09,260 --> 00:23:12,190
>> MIKE RIZZO: Έτσι για να εισέλθουν στην κονσόλα,
Υποθέτω ότι θα πρέπει εν συντομία

477
00:23:12,190 --> 00:23:13,750
αναφέρουμε πώς να το κάνουμε αυτό.

478
00:23:13,750 --> 00:23:17,850
Κατά τα τελευταία προβλήματα που μπορεί να έχετε
μεταχειρισμένα Chrome για να επιθεωρήσει το στοιχείο

479
00:23:17,850 --> 00:23:20,440
λειτουργίες ή να δείτε την πηγή της σελίδας -

480
00:23:20,440 --> 00:23:23,870
και αυτά είναι προσβάσιμα μόνο από δεξιά
κλικ στη σελίδα ή ένα συγκεκριμένο

481
00:23:23,870 --> 00:23:28,430
στοιχείο και να κάνει είτε να επιθεωρήσει
στοιχείο ή προβολή πηγής σελίδας.

482
00:23:28,430 --> 00:23:31,190
Μπορούμε επίσης να αποκτήσετε πρόσβαση στο JavaScript
κονσόλα απευθείας από

483
00:23:31,190 --> 00:23:33,630
επιλέγοντας επιθεωρήσει το στοιχείο.

484
00:23:33,630 --> 00:23:37,930
Έτσι, τότε μπορείτε απλά να πατήσετε κονσόλα
στην δεξιά πλευρά.

485
00:23:37,930 --> 00:23:41,900
>> Εναλλακτικά, θα μπορούσατε να έχετε πάει επίσης
στην άνω δεξιά γωνία,

486
00:23:41,900 --> 00:23:46,820
η οποία κόβεται σε αυτή την οθόνη, όπου
έχει τις τρεις οριζόντιες γραμμές.

487
00:23:46,820 --> 00:23:52,010
Και θα πάει κάτω σε εργαλεία και
Στη συνέχεια κονσόλα JavaScript

488
00:23:52,010 --> 00:23:53,240
εδώ όπου μπορείτε να δείτε -

489
00:23:53,240 --> 00:23:54,370
τουλάχιστον για τα Windows -

490
00:23:54,370 --> 00:23:59,680
η συντόμευση είναι ο έλεγχος Shift J. Έτσι, στη συνέχεια
αν θέλαμε να επιλέξετε ένα στοιχείο

491
00:23:59,680 --> 00:24:06,060
μέσα σε αυτήν τη σελίδα, όπως ακριβώς έδειξε
πριν, κάνουμε σύμβολο του δολαρίου ανοιχτό parens

492
00:24:06,060 --> 00:24:08,180
και στη συνέχεια αποσπάσματα.

493
00:24:08,180 --> 00:24:11,750
>> Ένα ενδιαφέρον πράγμα είναι, σε γενικές γραμμές,
μονά εισαγωγικά και διπλά εισαγωγικά είναι

494
00:24:11,750 --> 00:24:12,370
ανταλλάξιμα.

495
00:24:12,370 --> 00:24:16,050
Έτσι, πολλοί άνθρωποι χρησιμοποιούν μόνο και μόνο
εισαγωγικά επειδή είναι πιο γρήγορα να πληκτρολογήσετε

496
00:24:16,050 --> 00:24:19,780
από διπλά εισαγωγικά, γιατί δεν το κάνετε
πρέπει να κρατήσετε πατημένο το πλήκτρο Shift.

497
00:24:19,780 --> 00:24:21,770
Γι 'αυτό θα κάνει ακριβώς αυτό τώρα.

498
00:24:21,770 --> 00:24:24,510
>> Θέλω, λοιπόν, να επιλέξετε κάτι
με την τάξη.

499
00:24:24,510 --> 00:24:27,200
Container, μόνο και μόνο επειδή ξέρω ότι είναι
κάτι που είναι για μας

500
00:24:27,200 --> 00:24:28,740
ιστοσελίδα τώρα.

501
00:24:28,740 --> 00:24:29,520
Και εγώ πατήστε Enter.

502
00:24:29,520 --> 00:24:31,670
Και μπορούμε να δούμε ότι το επιλεγμένο.

503
00:24:31,670 --> 00:24:34,990
Γι 'αυτό εμφανίζεται ότι
επέστρεψε αυτό το αντικείμενο.

504
00:24:34,990 --> 00:24:36,620
Έτσι, αυτό είναι μια βασική επιλογή.

505
00:24:36,620 --> 00:24:40,080
Αν θέλαμε να το χειριστούν στην πράξη,
θα πρέπει να καλέσετε κάτι

506
00:24:40,080 --> 00:24:43,925
για εκείνη την επιλογή, η οποία
θα μπει αργότερα.

507
00:24:43,925 --> 00:24:49,030
>> ΤΟΜΑΣ REIMERS: Έτσι απλά για να δούμε ότι
περισσότερο σε βάθος, αυτό δεν είναι διαφορετικό

508
00:24:49,030 --> 00:24:52,245
από τις κλήσεις συναρτήσεων που κάναμε στο C.
Το όνομα της συνάρτησης εδώ είναι μια

509
00:24:52,245 --> 00:24:52,580
λίγο παράξενο.

510
00:24:52,580 --> 00:24:55,640
Είναι το σύμβολο του δολαρίου.

511
00:24:55,640 --> 00:24:57,010
Είναι απλά ένα όνομα της συνάρτησης.

512
00:24:57,010 --> 00:24:58,810
Δεν υπάρχει τίποτα το ιδιαίτερο γι 'αυτό.

513
00:24:58,810 --> 00:25:00,450
>> Έχουμε ανοιχτές παρενθέσεις.

514
00:25:00,450 --> 00:25:03,880
Στη συνέχεια, έχουμε ένα επιχείρημα μας, η οποία
στην περίπτωση αυτή συμβαίνει να είναι ένα string,

515
00:25:03,880 --> 00:25:05,680
η οποία είναι ένας επιλογέας για αυτό.

516
00:25:05,680 --> 00:25:08,130
Και στη συνέχεια, έχουμε μας
κλειστή παρένθεση.

517
00:25:08,130 --> 00:25:09,960
Έτσι μπράβο.

518
00:25:09,960 --> 00:25:11,500
>> Δεν είναι ότι πολύ διαφορετική.

519
00:25:11,500 --> 00:25:12,900
Παρά το γεγονός ότι δεν φαίνεται πολύ παράξενο.

520
00:25:12,900 --> 00:25:17,220
Και αυτό μπορεί να είναι, ένα είδος, ένα κόλλημα
σημείο για πολλούς ανθρώπους.

521
00:25:17,220 --> 00:25:21,460
>> MIKE RIZZO: Έτσι ομοίως, αν θέλαμε
για να επιλέξετε ένα στοιχείο που έχει μια ταυτότητα,

522
00:25:21,460 --> 00:25:23,470
τώρα θέλουμε να επιλέξετε από
ID αντί της κατηγορίας.

523
00:25:23,470 --> 00:25:28,080
Θα ήταν ένα παρόμοιο πράγμα, όπου θα
κάνει ακριβώς την απότομη σημάδι ταυτότητα.

524
00:25:28,080 --> 00:25:33,576
Έτσι είμαστε επιλέγοντας εδώ όλα
στοιχεία που έχουν bar ID.

525
00:25:33,576 --> 00:25:35,400
>> ΤΟΜΑΣ REIMERS: Και αυτό επεκτείνεται.

526
00:25:35,400 --> 00:25:36,450
Αυτό εκτείνεται CSS.

527
00:25:36,450 --> 00:25:42,260
Ακριβώς όπως και στο CSS, μπορείτε να επιλέξετε όλα
συνδέσεις, οι οποίες έχουν την κλάση foo.

528
00:25:42,260 --> 00:25:43,420
Εδώ, είναι το ίδιο πράγμα.

529
00:25:43,420 --> 00:25:52,750
>> Θα μπορούσατε να κάνετε a.foo, γεγονός που θα επιλέξετε
όλες τις συνδέσεις με την κατηγορία foo.

530
00:25:52,750 --> 00:25:58,860
Θα μπορούσατε να κάνετε μια απότομη γραμμή, η οποία θα
επιλέξτε τη σύνδεση με τη γραμμή ID και έτσι

531
00:25:58,860 --> 00:25:59,770
καθεξής και ούτω καθεξής.

532
00:25:59,770 --> 00:26:02,120
Κάθε επιλογέας CSS είναι έγκυρη
jQuery επιλογέα.

533
00:26:02,120 --> 00:26:03,370
>> MIKE RIZZO: Ναι.

534
00:26:03,370 --> 00:26:07,996

535
00:26:07,996 --> 00:26:11,460
ΕΝΤΑΞΕΙ, έτσι τώρα ας μπει σε λίγο
χειραγώγησης που μπορούμε να κάνουμε με

536
00:26:11,460 --> 00:26:12,870
jQuery μας.

537
00:26:12,870 --> 00:26:19,280
Έτσι, jQuery έχει ένα συγκεκριμένο τύπο
της σημειογραφίας όπου απλά χρησιμοποιήστε

538
00:26:19,280 --> 00:26:20,170
μια κουκίδα στο τέλος.

539
00:26:20,170 --> 00:26:23,340
Και μπορείτε να σκεφτείτε αυτό όπως και σε
C πώς είχαμε διαφορετικές structs.

540
00:26:23,340 --> 00:26:27,110
Και για να πάμε σε αυτά τα structs, θα κάνατε
χρησιμοποιήστε μια τελεία για να μπει σε αυτά.

541
00:26:27,110 --> 00:26:28,480
>> Αυτό είναι το είδος του, ένα παρόμοιο πράγμα.

542
00:26:28,480 --> 00:26:33,570
Μόνο που τώρα έχουμε λειτουργίες εντός της εν λόγω
επιλογέα ότι μπορούμε να καλέσουμε σε αυτό.

543
00:26:33,570 --> 00:26:38,640
Μέχρι εδώ, το πρώτο παράδειγμα
μπορείτε να δείτε είναι ένας επιλογέας CSS.

544
00:26:38,640 --> 00:26:45,290
Και βασικά, αυτό που κάνει είναι να
ισχύει το πρώτο στοιχείο CSS σε αυτό

545
00:26:45,290 --> 00:26:46,230
πράγμα που έχετε επιλέξει -

546
00:26:46,230 --> 00:26:47,720
αυτό το στοιχείο που επιλέξατε -

547
00:26:47,720 --> 00:26:49,290
με την τιμή αυτής.

548
00:26:49,290 --> 00:26:55,390
>> ΤΟΜΑΣ REIMERS: Έτσι μια εύκολη μετάφραση
ότι θα ήταν αν jQuery, βασικά,

549
00:26:55,390 --> 00:26:57,790
μόλις πήρε foo.

550
00:26:57,790 --> 00:27:05,480
Και στη συνέχεια, CSS, δήλωσε,
χρώμα κόκκινο και κλείσιμο.

551
00:27:05,480 --> 00:27:06,670
Είναι η ίδια ιδέα.

552
00:27:06,670 --> 00:27:08,800
Αυτό που κάνει είναι ότι είναι επιλεγμένο
όλα τα στοιχεία foo.

553
00:27:08,800 --> 00:27:10,170
Και τότε είναι που εφαρμόζεται.

554
00:27:10,170 --> 00:27:15,884
Ταξινόμηση της, το χρώμα ακινήτων
είναι ίσο με κόκκινο.

555
00:27:15,884 --> 00:27:21,070
>> MIKE RIZZO: Ομοίως, μπορούμε επίσης να μεταβάλλει
το πραγματικό περιεχόμενο του τι είναι

556
00:27:21,070 --> 00:27:24,870
προβάλλεται στον κώδικα HTML της σελίδας, η οποία
είναι πραγματικά δροσερό, διότι αυτό σημαίνει ότι σας

557
00:27:24,870 --> 00:27:28,095
ιστοσελίδες μπορεί τώρα να είναι εντελώς δυναμική
και δεν πρέπει να είναι στατική

558
00:27:28,095 --> 00:27:31,660
να εκτυπώσετε χρησιμοποιώντας PHP
στην αρχή του

559
00:27:31,660 --> 00:27:33,320
η σελίδα που φορτώνεται.

560
00:27:33,320 --> 00:27:36,810
Μέχρι εδώ, αν θέλαμε να αλλάξει η
πραγματική HTML της σελίδας, θα θέλαμε τώρα

561
00:27:36,810 --> 00:27:43,550
να καλέσετε τη συνάρτηση HTML, η οποία στη συνέχεια, μόλις
ένθετα ό, τι ορίζουμε σε

562
00:27:43,550 --> 00:27:45,390
ότι το στοιχείο που επιλέξατε.

563
00:27:45,390 --> 00:27:49,810
Έτσι, εδώ είμαστε επιλέγοντας το στοιχείο με
Κατηγορία foo και, στη συνέχεια, λέγοντας ότι είναι HTML

564
00:27:49,810 --> 00:27:52,200
είναι τώρα hello world.

565
00:27:52,200 --> 00:27:55,600
>> ΤΟΜΑΣ REIMERS: Και όταν σκέφτεστε για
Ποια είναι χρήσιμες εφαρμογές της

566
00:27:55,600 --> 00:28:00,800
αυτό, αυτό CSS ένα, το πρώτο πράγμα που
μπορείτε να αρχίσετε να σκεφτούμε είναι

567
00:28:00,800 --> 00:28:03,070
από την άποψη του ακόμα και drop down μενού.

568
00:28:03,070 --> 00:28:08,350
Θα μπορούσε να αρχίσει να κάνουμε τα πράγματα όπως, όταν
ένας χρήστης αιωρείται πάνω από το επάνω μέρος

569
00:28:08,350 --> 00:28:11,970
από μια κάτω πτώση, θέλετε να κάνετε
το κάτω μέρος ορατό.

570
00:28:11,970 --> 00:28:12,540
Σωστά;

571
00:28:12,540 --> 00:28:15,610
>> Έτσι, CSS, έχουμε ιδιότητες
να κάνει κάτι ορατό.

572
00:28:15,610 --> 00:28:19,330
Τα πράγματα, όπως κανένας οθόνη του παχέος εντέρου
θα τον κάνουν αόρατο.

573
00:28:19,330 --> 00:28:21,190
Μπλοκ οθόνη θα το κάνετε ορατό.

574
00:28:21,190 --> 00:28:25,860
Ή ακόμα και αν θέλετε να πάτε πιο απλό, θα
έχουν τα πράγματα όπως ισούται προβολής

575
00:28:25,860 --> 00:28:27,520
ορατό, και η ορατότητα είναι ίση με κρυφό.

576
00:28:27,520 --> 00:28:30,330

577
00:28:30,330 --> 00:28:34,780
>> Και θα μπορούσε να αρχίσει να εφαρμόσουν τα πράγματα
όπως drop down μενού δεξιά

578
00:28:34,780 --> 00:28:38,410
μετά μπορείτε να πάρετε μέσα από την ιδέα του πώς
μπορεί να σας καταλάβω, όταν αυτό ανοίγει,

579
00:28:38,410 --> 00:28:39,850
το οποίο θα περάσει πολύ σύντομα.

580
00:28:39,850 --> 00:28:42,160
Αλλά μπορούμε να αρχίσουμε να βλέπουμε
εφαρμογές αυτής.

581
00:28:42,160 --> 00:28:45,540
Σε μια παρόμοια αίσθηση, αν ήταν να δοκιμάσετε
και να εφαρμόσει, ας πούμε, μια συνομιλία

582
00:28:45,540 --> 00:28:48,620
κινητήρα και θέλετε να κάνετε μια μικρή
φούσκα ομιλία καταλήξει κάθε φορά που έχετε

583
00:28:48,620 --> 00:28:52,880
πήρε ένα νέο μήνυμα, τη στιγμή που θα πάρει το
νέο μήνυμα, μπορείτε να κάνετε μια μικρή

584
00:28:52,880 --> 00:28:55,890
φούσκα ομιλία καταλήξει με την αλλαγή
το HTML της σελίδας, έτσι δεν είναι;

585
00:28:55,890 --> 00:29:00,540
Με την προσθήκη ότι επιπλέον φούσκα ομιλία
με το επιπλέον κείμενο εκεί.

586
00:29:00,540 --> 00:29:01,140
Ναι;

587
00:29:01,140 --> 00:29:07,750
>> ΚΟΙΝΟ: Έτσι θα ενσωματώσετε αυτό στο πλαίσιο
ο κώδικας HTML στο είδος του σαν ένα

588
00:29:07,750 --> 00:29:10,534
[Δεν ακούγεται];

589
00:29:10,534 --> 00:29:12,940
>> MIKE RIZZO: Σωστά.

590
00:29:12,940 --> 00:29:16,190
Ναι, θα φτάσουμε σε αυτό
σε λίγο.

591
00:29:16,190 --> 00:29:18,810
Ναι, είναι παρεμφερείς
λίγο σε PHP.

592
00:29:18,810 --> 00:29:21,240
Δεν είναι ακριβώς όμοια.

593
00:29:21,240 --> 00:29:24,730
>> Μια καλή διάκριση να είναι ό, τι αυτό
είναι στην πραγματικότητα επεξεργασία όταν επεξεργαστείτε

594
00:29:24,730 --> 00:29:28,480
η σελίδα επειδή δεν πρόκειται να είναι
την επεξεργασία του αρχείου που γίνεται

595
00:29:28,480 --> 00:29:31,380
φυλάσσονται στον server γιατί ο κόσμος
δεν θα πρέπει να έχουν άδεια

596
00:29:31,380 --> 00:29:32,610
για να επεξεργαστείτε τα αρχεία σας.

597
00:29:32,610 --> 00:29:36,080
Αυτό είναι ακριβώς ό, τι είναι μοντάζ στη σελίδα
και τι να εμφανίζονται μέσα

598
00:29:36,080 --> 00:29:36,950
το πρόγραμμα περιήγησης.

599
00:29:36,950 --> 00:29:40,340
Έτσι, εάν επρόκειτο να φορτώσετε τη σελίδα αφού,
λένε, διαγράφοντας κάτι που εμείς

600
00:29:40,340 --> 00:29:44,730
δείτε που μπορούμε να κάνουμε με την κλήση αφαίρεση,
αυτό το πράγμα τότε θα επανεμφανιστεί.

601
00:29:44,730 --> 00:29:48,590
>> ΤΟΜΑΣ REIMERS: Έτσι, ένας τρόπος για να σκεφτεί για
αυτό είναι αν είμαι στον υπολογιστή σας και

602
00:29:48,590 --> 00:29:50,170
Ο Mike είναι, είδος, ο server.

603
00:29:50,170 --> 00:29:53,850
Τι πρόκειται να συμβεί είναι Πάω να
ρωτήστε Mike, hey, μπορώ να έχω ένα αντίγραφο του

604
00:29:53,850 --> 00:29:54,630
αυτή η ιστοσελίδα;

605
00:29:54,630 --> 00:29:56,190
Και θα μου δώσει ένα αντίγραφο από αυτό.

606
00:29:56,190 --> 00:29:57,430
>> Όχι, δεν είναι το αρχικό πράγμα.

607
00:29:57,430 --> 00:29:58,620
Είναι απλά ένα αντίγραφο.

608
00:29:58,620 --> 00:30:00,450
Και τότε θα είναι όπως, OH,
υπάρχει κώδικας JavaScript εδώ.

609
00:30:00,450 --> 00:30:02,450
Σαφώς, θα πρέπει να επεξεργαστείτε το
Η σελίδα να είναι σαν αυτό.

610
00:30:02,450 --> 00:30:04,250
Και είμαι επεξεργάζεστε το δικό σας αντίγραφο.

611
00:30:04,250 --> 00:30:05,920
>> Αλλά αυτό δεν πραγματοποιεί
το πραγματικό αντίγραφο.

612
00:30:05,920 --> 00:30:08,480
Κι αν ήταν να τον ρωτήσω ξανά
ανανεώσετε τη σελίδα, -

613
00:30:08,480 --> 00:30:10,060
hey, μπορώ να έχω ένα καθαρό αντίγραφο -

614
00:30:10,060 --> 00:30:11,440
ότι πρόκειται να μου δώσει
ένα άλλο καθαρό αντίγραφο.

615
00:30:11,440 --> 00:30:14,240
Και στη συνέχεια, Πάω να κάνω το ίδιο πράγμα
όπως, OH, αυτό JS εδώ που λέει

616
00:30:14,240 --> 00:30:14,866
για να επεξεργαστείτε αυτό.

617
00:30:14,866 --> 00:30:17,460
Και Πάω να συνεχίσω να το κάνω αυτό.

618
00:30:17,460 --> 00:30:20,930
>> MIKE RIZZO: Έτσι, ένα πραγματικά δροσερό πράγμα
ότι μπορείτε να κάνετε με jQuery είναι

619
00:30:20,930 --> 00:30:24,350
πραγματικά να προσθέσετε διαφορετικούς τύπους
των κινούμενων εικόνων στη σελίδα σας.

620
00:30:24,350 --> 00:30:27,440
Δεν ξέρω αν έχετε δει ποτέ, όπου
προσπαθείτε να το συμπληρώσετε μια φόρμα

621
00:30:27,440 --> 00:30:31,250
σε απευθείας σύνδεση και να μην συμπληρώσετε
τα πράγματα σωστά.

622
00:30:31,250 --> 00:30:33,440
Έτσι, ένα μικρό πράγμα ολισθαίνει προς τα κάτω
στην κορυφή και σας λέει

623
00:30:33,440 --> 00:30:34,820
δεν το έχετε κάνει σωστά.

624
00:30:34,820 --> 00:30:36,260
Παρακαλώ δοκιμάστε ξανά.

625
00:30:36,260 --> 00:30:37,890
Και τότε, ίσως ακόμη και μόνο διαφάνεια προς τα επάνω.

626
00:30:37,890 --> 00:30:40,710
>> Βγάζει jQuery έχει ενσωματωμένες λειτουργίες
που κάνουν όλα αυτά

627
00:30:40,710 --> 00:30:44,180
animation πραγματικά, πραγματικά εύκολο.

628
00:30:44,180 --> 00:30:46,750
Έτσι, υπάρχει η πρώτη fade
ανάληψη καθηκόντων, η οποία

629
00:30:46,750 --> 00:30:47,710
μπορείτε να καλέσετε σε κάτι.

630
00:30:47,710 --> 00:30:55,650
Και αυτό είναι ένας τρόπος για να αλλάξετε το CSS του
το στοιχείο αυτό ως κινούμενα σχέδια.

631
00:30:55,650 --> 00:30:58,480
Γι 'αυτό χρειάζεται ό, τι στοιχείο
να καλέσετε το fade out σε.

632
00:30:58,480 --> 00:31:03,990
Και στη συνέχεια, σιγά-σιγά αλλάζει η αδιαφάνεια που είναι
μέχρι να πάει εντελώς διαφανή.

633
00:31:03,990 --> 00:31:07,330
>> ΤΟΜΑΣ REIMERS: Η άλλη δημοφιλής
έχει ολισθήσει προς τα κάτω, η οποία θα κάνει

634
00:31:07,330 --> 00:31:08,800
κάτι που φαίνεται από την ολίσθηση προς τα κάτω.

635
00:31:08,800 --> 00:31:12,840
Έτσι, στην περίπτωση του μενού drop down,
και πάλι, όταν μάθαμε πώς να ανιχνεύσει

636
00:31:12,840 --> 00:31:15,310
όταν αυτό έχει αιωρούνταν πάνω,
θα μπορούσατε απλά να πω αυτό κάτω

637
00:31:15,310 --> 00:31:16,910
μέρος πέφτουν τώρα.

638
00:31:16,910 --> 00:31:19,270
Και στη συνέχεια, φαίνεται
με την ολίσθηση προς τα κάτω.

639
00:31:19,270 --> 00:31:22,042

640
00:31:22,042 --> 00:31:26,590
>> MIKE RIZZO: Και τότε, αν έχετε μόλις
κάποιο είδος των κινουμένων σχεδίων κατά νου ότι

641
00:31:26,590 --> 00:31:29,080
jQuery δεν παρέχει απαραίτητα.

642
00:31:29,080 --> 00:31:32,690
Για παράδειγμα, ας πούμε jQuery
δεν σας παρέχει με μια διαφάνεια

643
00:31:32,690 --> 00:31:33,750
κάτω και διαφάνεια προς τα επάνω.

644
00:31:33,750 --> 00:31:36,740
Λοιπόν, ας πούμε ότι έχετε ήθελε να γλιστρήσει
κάτι από την αριστερή ή από

645
00:31:36,740 --> 00:31:39,880
το σωστό είδος της, όπως το CS50
κεντρική σελίδα κάνει όποτε

646
00:31:39,880 --> 00:31:42,080
πηγαίνετε σε μια νέα ομάδα.

647
00:31:42,080 --> 00:31:45,030
Στη συνέχεια, θα πρέπει πιθανώς να
εφαρμόσουν μόνοι σας χρησιμοποιώντας το

648
00:31:45,030 --> 00:31:49,310
εμψυχώσει λειτουργία μέσα jQuery.

649
00:31:49,310 --> 00:31:51,350
>> Έτσι, ομοίως, μόλις κίνηση.

650
00:31:51,350 --> 00:31:55,850
Και τότε, μέσα σε αυτό το παίρνει
λεξικό των διαφορετικών αξιών

651
00:31:55,850 --> 00:31:57,340
ότι είστε υποτίθεται για να περάσει.

652
00:31:57,340 --> 00:32:06,960
Μέχρι εδώ, αν θέλαμε να εμψυχώσει το
στοιχείο foo έτσι ώστε το πλάτος της, είτε

653
00:32:06,960 --> 00:32:10,880
διαστέλλεται ή συμβάσεις με 80 pixels,
ανάλογα με το τι είναι σήμερα.

654
00:32:10,880 --> 00:32:14,100
Θα περάσει ακριβώς αυτό, δεδομένου
το επιχείρημα μέσα σε αυτό.

655
00:32:14,100 --> 00:32:18,060
>> Εμψυχώσει επίσης να έχει κάποια άλλα επιχειρήματα
ότι θα μπορούσε να περάσει, για παράδειγμα,

656
00:32:18,060 --> 00:32:21,150
η ταχύτητα της κίνησης
που θέλετε να δώσετε.

657
00:32:21,150 --> 00:32:26,220
Και για να το κάνουμε αυτό, θα ήθελα να πω
γρήγορα Google jQuery κίνηση.

658
00:32:26,220 --> 00:32:31,710
Και τότε, ανατροφή αυτή τη σελίδα, μπορείτε να
δείτε το πήρε μια δέσμη των διαφορετικών

659
00:32:31,710 --> 00:32:33,560
ιδιότητες που μπορείτε να περάσετε.

660
00:32:33,560 --> 00:32:35,990
>> Και εγώ σας ενθαρρύνω - κάθε φορά που έρχονται
σε κάτι που δεν σας

661
00:32:35,990 --> 00:32:40,390
γνωρίζουν ή απλά θέλετε να μάθετε περισσότερα για ένα έργο
συγκεκριμένη μέθοδος που μπορείτε να καλέσετε

662
00:32:40,390 --> 00:32:41,270
σε κάτι -

663
00:32:41,270 --> 00:32:44,440
απλά το Google. jQuery είναι εξαιρετικά
καλά τεκμηριωμένη.

664
00:32:44,440 --> 00:32:49,140
Και συχνά φορές υπάρχουν πολλά
παραδείγματα που παρέχουν για σας.

665
00:32:49,140 --> 00:32:52,470
Αν μετακινηθείτε προς τα κάτω -

666
00:32:52,470 --> 00:32:53,720
τρόπος κάτω -

667
00:32:53,720 --> 00:32:57,660

668
00:32:57,660 --> 00:32:59,190
ότι μπορούμε να χρησιμοποιήσουμε, καθώς και.

669
00:32:59,190 --> 00:33:02,480
>> Και πάλι, όταν ένας προγραμματιστής πηγαίνει πραγματικά
από το πρόβλημα της γραφής ένα

670
00:33:02,480 --> 00:33:05,810
βιβλιοθήκη, που συνήθως θέλουν
κάποιος να το χρησιμοποιήσει.

671
00:33:05,810 --> 00:33:09,400
Έτσι, παράλληλα πρόκειται να
είναι μια τεκμηρίωση.

672
00:33:09,400 --> 00:33:12,270
Και ότι τα έγγραφα μπορούν συνήθως να
που βρίσκεται στη σελίδα του έργου, το οποίο είναι

673
00:33:12,270 --> 00:33:14,970
Γι 'αυτό σου έδωσε αυτό το αρχικό σημείο στο
η αρχή, που σας συνδέει με το

674
00:33:14,970 --> 00:33:18,080
σελίδες του έργου ώστε να μπορείτε να
δείτε ότι τα έγγραφα.

675
00:33:18,080 --> 00:33:22,670
>> Τυπικά, η σελίδα του έργου στην περίπτωση
του [δεν ακούγεται], σας το είπα

676
00:33:22,670 --> 00:33:23,940
ονόματα των κατηγοριών.

677
00:33:23,940 --> 00:33:27,250
Στην περίπτωση της JavaScript, δίνει
Σας το όνομα των λειτουργιών.

678
00:33:27,250 --> 00:33:35,310
Με την ευκαιρία, αν έχουμε κύλιση προς τα πάνω προς την κορυφή,
μια γρήγορη πλευρά σημείωση σχετικά με τις λειτουργίες είναι

679
00:33:35,310 --> 00:33:39,080
κάθε φορά που βλέπετε μια λειτουργία που εφαρμόζονται
όπως αυτό με το σκληρό

680
00:33:39,080 --> 00:33:43,800
παρένθεση στη μέση, ότι μέσα
ότι η ιδιότητα αυτή είναι προαιρετική.

681
00:33:43,800 --> 00:33:44,750
Ακριβώς ένα heads up.

682
00:33:44,750 --> 00:33:47,350
Έχω δει πολλές ερωτήσεις
γι 'αυτό.

683
00:33:47,350 --> 00:33:50,370
>> Έτσι, εδώ μπορούμε να δούμε ότι η
έμψυχο παίρνει ιδιότητες

684
00:33:50,370 --> 00:33:51,800
ως αναγκαίο επιχείρημα.

685
00:33:51,800 --> 00:33:54,870
Και όλα τα άλλα είναι προαιρετική.

686
00:33:54,870 --> 00:33:56,136
Σημείωση Side -

687
00:33:56,136 --> 00:33:58,090
μπορείτε να σκεφτείτε αυτό, το είδος
της, όπως σελίδες man.

688
00:33:58,090 --> 00:34:04,275
Ο άνθρωπος είναι σελίδες τεκμηρίωσης για C και
για πολλά άλλα πράγματα, όπως καλά.

689
00:34:04,275 --> 00:34:11,020
>> MIKE RIZZO: Έτσι, έχουμε μάθει πώς να
αλλάξετε διαφορετικά CSS στη σελίδα,

690
00:34:11,020 --> 00:34:14,040
εμψυχώσει αυτό, προσθέστε και αφαιρέστε HTML.

691
00:34:14,040 --> 00:34:16,889
Αλλά ένα από τα πιο ισχυρά πραγματικά
πράγματα σχετικά με JavaScript

692
00:34:16,889 --> 00:34:18,270
και ιδιαίτερα jQuery -

693
00:34:18,270 --> 00:34:22,570
τι σας επιτρέπει να κάνετε είναι να απαντήσετε σε
διαφορετικά στοιχεία που συμβαίνουν.

694
00:34:22,570 --> 00:34:25,380
Για παράδειγμα, εδώ έχουμε
ένα πρόγραμμα χειρισμού συμβάντων.

695
00:34:25,380 --> 00:34:28,210
Και αυτό σημαίνει ότι μόνο όποτε αυτό
γεγονός που συμβαίνει, θα το χειριστεί σε ένα

696
00:34:28,210 --> 00:34:29,280
συγκεκριμένο τρόπο.

697
00:34:29,280 --> 00:34:35,159
>> Μέχρι εδώ, η γενική εκδήλωση jQuery
handler είναι η τελεία του.

698
00:34:35,159 --> 00:34:42,949
Και στη συνέχεια, το πρώτο πράγμα που παρέχονται
είναι ό, τι εκδήλωση θα έπρεπε

699
00:34:42,949 --> 00:34:43,810
να ακούει για.

700
00:34:43,810 --> 00:34:45,610
Έτσι, εδώ, είναι το κλικ που
περιμένουμε για.

701
00:34:45,610 --> 00:34:49,250
>> ΤΟΜΑΣ REIMERS: Εναλλακτικά, έχετε
σε αιώρηση, το οποίο είναι ένα πολύ δημοφιλές.

702
00:34:49,250 --> 00:34:52,000
Έτσι, πίσω στο drop down μενού μου ιδέα.

703
00:34:52,000 --> 00:34:54,239
Θα έχετε την πάνω hover.

704
00:34:54,239 --> 00:34:56,096
Και τότε θα μπορούσε να αλλάξει αυτό.

705
00:34:56,096 --> 00:34:56,830
>> MIKE RIZZO: Σωστά.

706
00:34:56,830 --> 00:35:01,680
Και στη συνέχεια, όταν αυτό συμβεί, απλά
εκτελεί αυτή τη λειτουργία που του δίνουμε

707
00:35:01,680 --> 00:35:05,080
ως επιχείρημα και ότι
προειδοποιεί ένα γεια ή γεια.

708
00:35:05,080 --> 00:35:08,900
>> ΤΟΜΑΣ REIMERS: Έτσι, στην περίπτωση της
JavaScript, αυτό είναι ένα μέρος που πρέπει να

709
00:35:08,900 --> 00:35:12,970
απομακρυνόμαστε από την C. Μπορούμε πραγματικά
λάβει λειτουργεί ως επιχειρήματα.

710
00:35:12,970 --> 00:35:15,940
Και υπάρχουν πολλά πραγματικά
πολύπλοκους τρόπους για να γίνει αυτό.

711
00:35:15,940 --> 00:35:17,940
Εμείς πάμε για να προωθήσουν έναν τρόπο,
το οποίο είναι ότι μπορείτε να ορίσετε το

712
00:35:17,940 --> 00:35:19,270
λειτουργούν εκεί.

713
00:35:19,270 --> 00:35:22,540
>> Έτσι, όταν ζητάς για μια λειτουργία, όπως
μια παράμετρος, είστε ουσιαστικά μόνο

714
00:35:22,540 --> 00:35:24,500
πρόκειται να καθορίσει τη λειτουργία
επί τόπου.

715
00:35:24,500 --> 00:35:27,090
Και ο τρόπος που ορίζουμε μια συνάρτηση
σε JavaScript είναι σας

716
00:35:27,090 --> 00:35:28,820
κυριολεκτικά λένε λειτουργία.

717
00:35:28,820 --> 00:35:30,130
Στη συνέχεια, συνήθως, το όνομα
της συνάρτησης.

718
00:35:30,130 --> 00:35:32,510
Αλλά εμείς δεν πρόκειται ποτέ να αναφοράς
αυτή η λειτουργία ξανά.

719
00:35:32,510 --> 00:35:34,040
Γι 'αυτό αφήστε το ανώνυμο.

720
00:35:34,040 --> 00:35:40,440
>> Στη συνέχεια, οι παρενθέσεις, τότε το σγουρά
τιράντες, και στη συνέχεια ο κώδικας μέσα σε αυτό.

721
00:35:40,440 --> 00:35:42,540
Έτσι καταλαβαίνουμε αυτό το δοχείο
να είναι μια μικρή σύγχυση.

722
00:35:42,540 --> 00:35:45,180
Έτσι, σας δίνουμε τη γενική μορφή
τι ένα πρόγραμμα χειρισμού συμβάντων μοιάζει

723
00:35:45,180 --> 00:35:47,790
παρακάτω, η οποία είναι σχετικά με τα γεγονότα.

724
00:35:47,790 --> 00:35:50,598
Και τότε, τον κωδικό σας μέσα από αυτό.

725
00:35:50,598 --> 00:35:52,478
>> MIKE RIZZO: Υπάρχουν κάποια
ερωτήσεις σχετικά με αυτό;

726
00:35:52,478 --> 00:35:54,818
Αυτό μπορεί να είναι μια μικρή σύγχυση
η πρώτη φορά που θα το δείτε.

727
00:35:54,818 --> 00:35:57,550
>> ΤΟΜΑΣ REIMERS: Μπορείτε πραγματικά θέλουν να
να ανοίξει ένα αρχείο και να τους δείξουμε κάποια

728
00:35:57,550 --> 00:35:58,155
jQuery τώρα;

729
00:35:58,155 --> 00:35:59,853
>> MIKE RIZZO: Ναι, ας το κάνουμε αυτό.

730
00:35:59,853 --> 00:36:00,256
OK.

731
00:36:00,256 --> 00:36:02,490
>> ΤΟΜΑΣ REIMERS: Έτσι τώρα είμαστε
στη συσκευή.

732
00:36:02,490 --> 00:36:07,730
Και τι έχουμε κάνει είναι ότι έχουμε λάβει το
ελευθερία της δημιουργίας και ένα index.html

733
00:36:07,730 --> 00:36:10,100
αρχείο, το οποίο συνδέεται με
ένα αρχείο JavaScript.

734
00:36:10,100 --> 00:36:12,880
Και μπορούμε να ανοίξουμε το -

735
00:36:12,880 --> 00:36:15,170
ναι.

736
00:36:15,170 --> 00:36:16,630
Λοιπόν, κάνει δύο πράγματα.

737
00:36:16,630 --> 00:36:18,350
>> Το πρώτο είναι ότι συνδέει με
το αρχείο JavaScript.

738
00:36:18,350 --> 00:36:21,250
Και θα δούμε ότι μέχρι εδώ.

739
00:36:21,250 --> 00:36:25,340
Βλέπουμε ότι στο κεφάλι του
Έγγραφο HTML, ιδιαίτερα.

740
00:36:25,340 --> 00:36:28,260
Έτσι, θα δείτε ότι εκεί
εμείς, βασικά, ας πούμε SRC,

741
00:36:28,260 --> 00:36:29,590
που σημαίνει πηγή.

742
00:36:29,590 --> 00:36:30,630
Και αυτό είναι το URL.

743
00:36:30,630 --> 00:36:32,700
>> Εδώ λοιπόν μπορούμε να πούμε ότι έχουμε
περιλαμβάνονται jQuery.

744
00:36:32,700 --> 00:36:34,290
Και έχουμε συμπεριλάβει επίσης σενάρια.

745
00:36:34,290 --> 00:36:40,630
Ο άλλος τρόπος για να συμπεριλάβει JavaScript είναι
ότι μπορείτε να συμπεριλάβετε ένα σενάριο inline

746
00:36:40,630 --> 00:36:44,600
ετικέτα που έχουμε στο κάτω μέρος, όπου
λέει ο τύπος σενάριο είναι το κείμενο JavaScript.

747
00:36:44,600 --> 00:36:46,960
>> Έτσι λέμε, ακούστε, είμαστε
για να συμπεριληφθεί μια δέσμη ενεργειών.

748
00:36:46,960 --> 00:36:51,890
Και ο τύπος του εν λόγω σεναρίου είναι
JavaScript, το οποίο είναι ένα είδος του κειμένου.

749
00:36:51,890 --> 00:36:52,550
Πολύ απλό.

750
00:36:52,550 --> 00:36:56,490
>> MIKE RIZZO: Έτσι, αυτό, το είδος του, παίρνει να
ερώτησή σας για το πώς μπορούμε να περιλαμβάνει

751
00:36:56,490 --> 00:37:02,340
JavaScript στο αρχείο μας, γιατί όταν εμείς
είχε PHP, μπορούμε να κάνουμε κάτι σαν αυτό.

752
00:37:02,340 --> 00:37:07,570
Και τότε, έχουν τις συναρτήσεις PHP μας -
ας πούμε τα αποθέματα κάνουμε

753
00:37:07,570 --> 00:37:09,150
κάτι με αυτό -

754
00:37:09,150 --> 00:37:10,490
πηγαίνει εκεί.

755
00:37:10,490 --> 00:37:13,860
Ωστόσο, τώρα έχουμε τις ετικέτες script
ότι δίνουμε, τα οποία είναι στην πραγματικότητα

756
00:37:13,860 --> 00:37:19,470
μέρος της ίδιας της HTML επειδή δεν είναι
απομίμηση είναι ένα αρχείο HTML, όπως το

757
00:37:19,470 --> 00:37:25,070
είναι σε PHP, διότι αν πραγματικά να πάνε στο
και να ερευνήσει την πηγή της σελίδας,

758
00:37:25,070 --> 00:37:28,430
θα δείτε αυτές τις ετικέτες script εκεί
με το JavaScript που σχετίζονται με

759
00:37:28,430 --> 00:37:29,800
τους σε αυτό.

760
00:37:29,800 --> 00:37:31,760
>> Έτσι λοιπόν, αν θέλαμε να
γράψετε κάποια JavaScript -

761
00:37:31,760 --> 00:37:37,110
ας πούμε ότι ήθελε να αλλάξει το σώμα
γιατί αυτή τη στιγμή δεν έχω

762
00:37:37,110 --> 00:37:40,020
οποιεσδήποτε άλλες ετικέτες που μπορώ πραγματικά
επεξεργαστείτε εκτός από το σώμα.

763
00:37:40,020 --> 00:37:42,450
Ας πούμε απλά ήθελα να
αλλάξετε το CSS αυτό.

764
00:37:42,450 --> 00:37:46,190
Έτσι θα πάμε μπροστά και αλλαγή
το χρώμα της στο κόκκινο.

765
00:37:46,190 --> 00:37:47,380
>> Γι 'αυτό και αποθηκεύσετε το αρχείο.

766
00:37:47,380 --> 00:37:52,700
Ας πάμε πίσω στην ιστοσελίδα μας, ανανέωσης,
και το κάνει αυτόματα

767
00:37:52,700 --> 00:37:55,920
επειδή δεν φαίνεται σαν να περίμενε
καθόλου γιατί δεν ακούμε

768
00:37:55,920 --> 00:37:59,450
για μια εκδήλωση ή κάτι τέτοιο.

769
00:37:59,450 --> 00:38:02,800
>> ΤΟΜΑΣ REIMERS: Έτσι, αν πάμε πίσω στο ότι
αρχείο ιδίως - την HTML

770
00:38:02,800 --> 00:38:04,710
αρχείο - τι πρόκειται
για να δούμε είναι ότι έχουμε -

771
00:38:04,710 --> 00:38:06,810
να θυμάστε ότι αυτό είναι φορτωμένο,
είδος, χρονολογικά.

772
00:38:06,810 --> 00:38:09,910
Έτσι έχουμε πρώτα το κεφάλι.
φορτώνει αυτά τα δύο αρχεία.

773
00:38:09,910 --> 00:38:10,800
Στη συνέχεια πάμε στο σώμα.

774
00:38:10,800 --> 00:38:11,640
Και βλέπουμε hello world.

775
00:38:11,640 --> 00:38:13,030
Γι 'αυτό και καθιστούν hello world.

776
00:38:13,030 --> 00:38:15,240
>> Και τότε το τελευταίο πράγμα που έχουμε
είναι ότι έχουν την ετικέτα script.

777
00:38:15,240 --> 00:38:20,880
Έτσι ώστε να τρέχει το script tag το γιατί είναι
Δεν το λέω να περιμένουμε τίποτα.

778
00:38:20,880 --> 00:38:24,700
Και αυτό είναι το πιο βασικό
τρόπος για να τρέξει το JavaScript.

779
00:38:24,700 --> 00:38:29,200
>> Με αυτόν εν λόγω, μπορεί να σας βάλει το σενάριο
ετικέτα πάνω στην κεφαλίδα μόνο

780
00:38:29,200 --> 00:38:31,240
για να δείξει αυτό το σημείο;

781
00:38:31,240 --> 00:38:34,450

782
00:38:34,450 --> 00:38:35,700
Και να τρέξει αυτό.

783
00:38:35,700 --> 00:38:38,880

784
00:38:38,880 --> 00:38:41,070
Εμείς πάμε για να παρατηρήσετε ότι
δεν άλλαξε το χρώμα.

785
00:38:41,070 --> 00:38:44,210
Και αυτό είναι ένα από τα προβλήματα των
Javascript είναι ότι τα πράγματα είναι φορτωμένο

786
00:38:44,210 --> 00:38:45,930
σε χρονολογική σειρά.

787
00:38:45,930 --> 00:38:49,750
>> Έτσι, τη στιγμή που ο κώδικας αυτός
έτρεχε, έχουμε επιλέξει -

788
00:38:49,750 --> 00:38:52,530
πάτε πίσω -

789
00:38:52,530 --> 00:38:53,670
η ετικέτα του σώματος.

790
00:38:53,670 --> 00:38:57,560
Η ετικέτα του σώματος δεν υπάρχει ακόμα, επειδή
JavaScript είναι σύμφωνη με την HTML.

791
00:38:57,560 --> 00:39:01,790
Έτσι, το πρόγραμμα περιήγησης είναι σαν επιλέξτε σώμα.

792
00:39:01,790 --> 00:39:02,760
Δεν υπάρχει τέτοιο πράγμα ακόμα.

793
00:39:02,760 --> 00:39:03,600
Έτσι μπορούμε να το αγνοήσουμε.

794
00:39:03,600 --> 00:39:05,330
Και συνεχίζουμε.

795
00:39:05,330 --> 00:39:07,200
>> Και στη συνέχεια, ορίζουμε μια ετικέτα του σώματος.

796
00:39:07,200 --> 00:39:09,670
Αλλά αυτό ποτέ δεν παίρνει ενημερωμένο.

797
00:39:09,670 --> 00:39:12,560
Έτσι, όταν είστε εφαρμογής script
ετικέτες, βεβαιωθείτε ότι έχετε τοποθετήσει

798
00:39:12,560 --> 00:39:15,502
μετά την ετικέτα του σώματος.

799
00:39:15,502 --> 00:39:16,820
Επόμενη διαφάνεια.

800
00:39:16,820 --> 00:39:17,830
>> MIKE RIZZO: OK.

801
00:39:17,830 --> 00:39:19,330
Έτσι αλλάξαμε κάτι.

802
00:39:19,330 --> 00:39:21,910
Αλλά δεν μοιάζει σαν να απαντήσει σε
μας σε όλα, επειδή ακριβώς το είδος της

803
00:39:21,910 --> 00:39:24,150
έκανε μόλις φορτωθεί τη σελίδα.

804
00:39:24,150 --> 00:39:27,700
Έτσι τώρα, αντί να κάνουν αυτό, γιατί
Δεν έχουμε προσθέσει ένα πρόγραμμα χειρισμού συμβάντων.

805
00:39:27,700 --> 00:39:31,020
>> Οπότε ας κάνουμε κάτι
στο σώμα και πάλι.

806
00:39:31,020 --> 00:39:33,490
Και ας πούμε ότι το κάνουμε για -

807
00:39:33,490 --> 00:39:34,500
κάντε κλικ στο κουμπί.

808
00:39:34,500 --> 00:39:35,750
Θα προσθέσει μια λειτουργία.

809
00:39:35,750 --> 00:39:38,270

810
00:39:38,270 --> 00:39:39,690
>> Ας αλλαγή: ΤΟΜΑΣ REIMERS
το χρώμα του σε κόκκινο και πάλι.

811
00:39:39,690 --> 00:39:40,000
Γιατί όχι;

812
00:39:40,000 --> 00:39:41,680
>> Αλλαγή Ναι, ας: MIKE RIZZO
«το χρώμα του σε κόκκινο και πάλι.

813
00:39:41,680 --> 00:39:46,310

814
00:39:46,310 --> 00:39:46,900
Εντάξει.

815
00:39:46,900 --> 00:39:48,480
Οπότε ας ξαναφορτώστε τη σελίδα.

816
00:39:48,480 --> 00:39:49,530
OK, βλέπουμε -

817
00:39:49,530 --> 00:39:52,290
όπως ήταν αναμενόμενο, δεν γίνονται κόκκινα ακόμα.

818
00:39:52,290 --> 00:39:53,610
Αλλά τότε μπορούμε να πάμε μπροστά και κάντε κλικ σε αυτό.

819
00:39:53,610 --> 00:39:54,270
>> ΤΟΜΑΣ REIMERS: Και δεν γίνονται κόκκινα.

820
00:39:54,270 --> 00:39:56,090
>> MIKE RIZZO: Και το κάνει
γίνονται κόκκινα, όπως αναμενόταν.

821
00:39:56,090 --> 00:39:59,010
>> ΤΟΜΑΣ REIMERS: Και μπορούμε να δούμε πώς
μπορούμε να αρχίσουμε να οικοδομήσουμε πολύ βασικό

822
00:39:59,010 --> 00:40:00,170
αλληλεπίδραση.

823
00:40:00,170 --> 00:40:03,850
Άλλα πράγματα που ίσως να θέλετε να κάνετε είναι,
αν δεν θέλετε να κάνετε το σώμα

824
00:40:03,850 --> 00:40:07,230
χρώμα κόκκινο, ας κάνει το HTML
φόντο κόκκινο χρώμα.

825
00:40:07,230 --> 00:40:08,480
Ακριβώς έτσι είναι το ίδιο CSS.

826
00:40:08,480 --> 00:40:19,960

827
00:40:19,960 --> 00:40:23,320
>> Και όταν θα το αλλάξουμε, μπορούμε να δούμε αυτό
πολύ δραματική επίδραση της αλλαγής του

828
00:40:23,320 --> 00:40:25,510
ολόκληρη τη σελίδα.

829
00:40:25,510 --> 00:40:29,100
Έτσι και πάλι, αν είστε εφαρμογής πράγματα,
μπορείτε να έχετε ένα συστατικό

830
00:40:29,100 --> 00:40:30,150
η οποία έχει ως στόχο να κάνουν κλικ σε.

831
00:40:30,150 --> 00:40:32,710
Ας πούμε ένα κουμπί Έξοδος και
ένα ολόκληρο άλλο συστατικό,

832
00:40:32,710 --> 00:40:33,830
η οποία έχει ως στόχο να ανταποκριθεί.

833
00:40:33,830 --> 00:40:35,755
Έτσι, θα αφαιρέσει ένα παράθυρο
όταν αυτό συμβεί.

834
00:40:35,755 --> 00:40:39,341

835
00:40:39,341 --> 00:40:40,700
>> MIKE RIZZO: OK.

836
00:40:40,700 --> 00:40:42,200
Ακριβώς όπως ένα παράδειγμα -

837
00:40:42,200 --> 00:40:44,400
δεν έχετε πάρει για να δείτε την προηγούμενη -

838
00:40:44,400 --> 00:40:47,500
Θα σας δείξω ακριβώς τι φαίνεται
όπως όταν έχουμε κρύψει κάτι.

839
00:40:47,500 --> 00:40:52,220
Γι 'αυτό θα πάμε μπροστά και να μην γλιστρούν πάνω.

840
00:40:52,220 --> 00:40:54,440
>> ΤΟΜΑΣ REIMERS: Θέλετε να τυλίξετε ότι σε μια
παράγραφος τύπου πριν το κάνουμε αυτό;

841
00:40:54,440 --> 00:40:55,132
>> MIKE RIZZO: OK.

842
00:40:55,132 --> 00:40:59,135
Ναι, γιατί να μην το κάνουμε αυτό ακριβώς έτσι
μπορούμε να επιλέξετε ένα λίγο περισσότερο.

843
00:40:59,135 --> 00:41:00,490
>> ΤΟΜΑΣ REIMERS: Και ας
να δώσει μια τάξη.

844
00:41:00,490 --> 00:41:01,740
>> MIKE RIZZO: Ναι.

845
00:41:01,740 --> 00:41:06,575

846
00:41:06,575 --> 00:41:09,920
Εντάξει, οπότε ας δούμε.

847
00:41:09,920 --> 00:41:14,820
Αντί να επιλέξετε το πραγματικό σώμα
τώρα, εγώ θα επιλέξετε ακριβώς ό, τι με

848
00:41:14,820 --> 00:41:18,780
τάξη γεια, η οποία εδώ
απλά ένα πράγμα.

849
00:41:18,780 --> 00:41:20,900
Γι 'αυτό και δεν θα πρέπει να
ανησυχείτε για αυτό.

850
00:41:20,900 --> 00:41:23,080
>> Γι 'αυτό και θα το ανανεώσετε.

851
00:41:23,080 --> 00:41:24,230
Θα προχωρήσει και κάντε κλικ σε αυτό.

852
00:41:24,230 --> 00:41:27,890
Και αυτό, το είδος του, έκανε μια περίεργη διαφάνεια
up πράγμα, το οποίο δεν φαίνεται ότι

853
00:41:27,890 --> 00:41:29,580
ελκυστική.

854
00:41:29,580 --> 00:41:31,060
Σε γενικές γραμμές, αυτά φαίνονται πολύ ωραία.

855
00:41:31,060 --> 00:41:32,720
Υποθέτω, αυτό - για κάποιους
λόγο - δεν το έκανε.

856
00:41:32,720 --> 00:41:36,640
Θα κάνω μόνο ένα fade out έτσι
μπορείτε να δείτε σε αυτό πάρα πολύ.

857
00:41:36,640 --> 00:41:38,100
Πολύ καλύτερο.

858
00:41:38,100 --> 00:41:41,150
>> Και τότε, αν ανοίξει το JavaScript
κονσόλα και πάλι και θέλουμε να δούμε τι

859
00:41:41,150 --> 00:41:43,900
μοιάζει όταν εξασθενίσει μέσα

860
00:41:43,900 --> 00:41:46,920
Τώρα, εγώ απλά καλέστε fade in σε αυτό.

861
00:41:46,920 --> 00:41:48,830
Και σβήνει πίσω μέσα

862
00:41:48,830 --> 00:41:56,150
>> Ομοίως, θα μπορούσε πραγματικά να περάσει
ένα επιχείρημα για να εξασθενίσει ή fade out,

863
00:41:56,150 --> 00:41:57,640
η οποία είναι, το είδος του, η ταχύτητα της.

864
00:41:57,640 --> 00:42:02,220
Ας πάμε μπροστά και να λέμε ότι θέλουμε
να πάμε σιγά-σιγά ξεθωριάζει μέσα

865
00:42:02,220 --> 00:42:04,250
Έτσι υποθέτω ότι ακόμη φαινόταν
πολύ γρήγορα.

866
00:42:04,250 --> 00:42:06,180
Αλλά ήταν πιο αργή από ό, τι πριν.

867
00:42:06,180 --> 00:42:10,340
>> ΤΟΜΑΣ REIMERS: Και αν θέλετε να βρείτε
περισσότερες πληροφορίες σχετικά με αυτά τα πράγματα, και πάλι,

868
00:42:10,340 --> 00:42:13,410
πήγαινε στην τεκμηρίωση jQuery,
το οποίο σας έχουμε δώσει, και να διαβάσετε

869
00:42:13,410 --> 00:42:13,735
μέσω αυτών.

870
00:42:13,735 --> 00:42:15,790
Τεκμηριώνουν τα καθήκοντά τους
απίστευτα καλά.

871
00:42:15,790 --> 00:42:18,622

872
00:42:18,622 --> 00:42:19,570
>> MIKE RIZZO: OK.

873
00:42:19,570 --> 00:42:21,560
Έτσι υποθέτω ας πάμε πίσω σε αυτό.

874
00:42:21,560 --> 00:42:23,490
Και μπορούμε να μιλήσουμε για την τελευταία σελίδα μας.

875
00:42:23,490 --> 00:42:24,690
Λοιπόν, μπορούμε να τελειώσουμε με Bootstrap.

876
00:42:24,690 --> 00:42:27,140
Και τότε θα το ανοίξουμε
για ορισμένες ερωτήσεις.

877
00:42:27,140 --> 00:42:30,180
Και εάν εσείς έχετε οποιεσδήποτε ιδέες που
θα θέλατε να προσπαθήσει να ρίξει και να δείτε

878
00:42:30,180 --> 00:42:34,150
αν μπορούμε να τους εφαρμόσουν με
JavaScript γρήγορα.

879
00:42:34,150 --> 00:42:37,890
>> Έτσι, πολύ γρήγορα για Bootstrap, η οποία
ήταν αυτομάτως στο

880
00:42:37,890 --> 00:42:41,700
τελευταία πρόβλημά σας βρίσκεται στον φάκελο CSS
και στην πραγματικότητα συνδέεται με το σας

881
00:42:41,700 --> 00:42:43,190
header.php.

882
00:42:43,190 --> 00:42:46,740
Έτσι θα μπορούσαν να έχουν προστεθεί μαθήματα που
ορίζονται εντός Bootstrap σε αυτό.

883
00:42:46,740 --> 00:42:50,490
Και θα έχουν στυλ αυτόματα
αυτά τα πράγματα αναλόγως.

884
00:42:50,490 --> 00:42:54,550
>> ΤΟΜΑΣ REIMERS: Έτσι Bootstrap είναι ένα πολύ
μαγικό πράγμα που αναπτύχθηκε από τους ανθρώπους

885
00:42:54,550 --> 00:42:55,340
στο Twitter.

886
00:42:55,340 --> 00:42:57,230
Και ό, τι είχε σκοπό να κάνει ήταν -

887
00:42:57,230 --> 00:43:00,740
πριν ιστοσελίδες ήταν πραγματικά σκληρά για να κάνουν
φαίνονται ωραία, ειδικά όταν είχαμε

888
00:43:00,740 --> 00:43:02,200
πολλά κοινά στοιχεία.

889
00:43:02,200 --> 00:43:04,770
Έτσι, πολλά κουμπιά της
web φαινόταν το ίδιο.

890
00:43:04,770 --> 00:43:08,960
>> Μια παρτίδα των πεδίων κειμένου μπορεί να γίνει
εξετάσουμε καλύτερα από ό, τι το πρότυπο κείμενο

891
00:43:08,960 --> 00:43:13,620
τομέα ίσως γνωρίζετε από πραγματικά
παλιές ιστοσελίδες ή κακώς γίνονται πραγματικά

892
00:43:13,620 --> 00:43:18,210
ιστοσελίδες, οι οποίες ακριβώς μοιάζει με κυριολεκτική
πλαίσια κειμένου, χωρίς καμία μορφή κειμένου

893
00:43:18,210 --> 00:43:21,190
σκιά ή οποιοδήποτε είδος ωραίο περίγραμμα.

894
00:43:21,190 --> 00:43:24,540
Έτσι, αυτό που έκανε ήταν Bootstrap είπε, επίσης,
έχουμε πολλά κοινά στυλ.

895
00:43:24,540 --> 00:43:28,210
Γιατί δεν κάνουμε ένα κοινό σύνολο CSS
και ένα κοινό σύνολο JavaScript ως

896
00:43:28,210 --> 00:43:32,210
καλά, το οποίο μπορεί να το στυλ καθώς είναι και οι οποίες
να δώσουμε στους ανθρώπους τα πράγματα όπως πτώση

897
00:43:32,210 --> 00:43:34,610
down μενού, το οποίο μπορεί να δώσει στους ανθρώπους
πράγματα όπως modals.

898
00:43:34,610 --> 00:43:38,580
>> Modal είναι ό, τι σκάει πάνω στη σελίδα
όποτε αυτό είναι για να κυριολεκτήσουμε

899
00:43:38,580 --> 00:43:41,090
κάτι, το οποίο εμποδίζει την περαιτέρω
αλληλεπίδραση μέχρι να

900
00:43:41,090 --> 00:43:43,110
αλληλεπιδρούν με αυτό.

901
00:43:43,110 --> 00:43:45,820
Κάτι τέτοιο είναι, είστε βέβαιοι
θέλετε να διαγράψετε αυτό το πράγμα;

902
00:43:45,820 --> 00:43:49,100
Δεν μπορείτε να κάνετε τίποτα άλλο
μέχρι να πούμε ναι ή όχι.

903
00:43:49,100 --> 00:43:52,720
>> Πήρε όλα αυτά και να πακετάρει
και τους είπε, εδώ είμαστε.

904
00:43:52,720 --> 00:43:54,630
Οι άνθρωποι μπορούν τώρα να χρησιμοποιήσουν αυτό.

905
00:43:54,630 --> 00:43:56,830
Και μπορείτε να το βρείτε πάνω
στο getbootstrap.com.

906
00:43:56,830 --> 00:44:00,480
Ήταν συμπεριλαμβάνονται αυτόματα μέσα
που το τελευταίο πρόβλημά σας.

907
00:44:00,480 --> 00:44:04,160
Και είστε περισσότερο από ευπρόσδεκτοι να
χρησιμοποιήσετε στο τελικό σχέδιο σας.

908
00:44:04,160 --> 00:44:06,950
Και αν θέλετε να ακολουθήσετε αυτό
σύνδεση για να πάρει Bootstrap.

909
00:44:06,950 --> 00:44:10,590

910
00:44:10,590 --> 00:44:15,700
>> Θα δείτε εδώ είναι το
Bootstrap CSS ιστοσελίδα.

911
00:44:15,700 --> 00:44:16,860
Θα δείτε Bootstrap.

912
00:44:16,860 --> 00:44:20,450
Και αν μετακινηθείτε προς τα κάτω, θα δείτε
πώς να το κατεβάσετε, πώς να

913
00:44:20,450 --> 00:44:21,900
εγκαταστήσετε, κ.λπ..

914
00:44:21,900 --> 00:44:24,700
>> MIKE RIZZO: Και μπορείτε επίσης,
αρκετά κατά τρόπο ενδιαφέροντα, το προσαρμόσετε

915
00:44:24,700 --> 00:44:27,770
να είναι ανεξάρτητα από το είδος των θεμάτων
που θέλετε.

916
00:44:27,770 --> 00:44:31,270
Ξέρω ότι είναι κάτι που έκανα για μου
τελικό σχέδιο όταν πήρα την κατηγορία

917
00:44:31,270 --> 00:44:32,050
ήταν το προσαρμόσετε.

918
00:44:32,050 --> 00:44:34,540
Μια διαφορετική εκδοχή του Bootstrap ότι
είχε ένα διαφορετικό συνδυασμό χρωμάτων και

919
00:44:34,540 --> 00:44:36,700
διαφορετικά σχήματα μερικών
διαφορετικά πράγματα.

920
00:44:36,700 --> 00:44:38,250
Γι 'αυτό σας ενθαρρύνω να παίξετε με αυτό.

921
00:44:38,250 --> 00:44:39,440
Είναι το είδος της διασκέδασης να κάνει.

922
00:44:39,440 --> 00:44:43,230
>> ΤΟΜΑΣ REIMERS: Κοιτάζοντας πέρα ​​από την κορυφή
και πάλι, είναι πολύ παρόμοιο με το γραμματοσειράς

923
00:44:43,230 --> 00:44:44,970
Φοβερό site.

924
00:44:44,970 --> 00:44:47,810
Μια πολλά έγγραφα θα ξεκινήσει
να φαίνεται παρόμοιο, όταν έχετε

925
00:44:47,810 --> 00:44:48,940
δει αρκετά από αυτό.

926
00:44:48,940 --> 00:44:51,260
Έτσι, εδώ έχουμε το CSS
συστατικό αυτό.

927
00:44:51,260 --> 00:44:53,540
Και θα δείτε πώς
να φορμάρετε τα πράγματα.

928
00:44:53,540 --> 00:44:56,780
Έτσι, αν κάνετε κλικ πάνω στα τραπέζια, για παράδειγμα,
μπορείτε να κάνετε αμέσως μια

929
00:44:56,780 --> 00:45:01,710
τραπέζι αρκετά με την απλή προσθήκη
Ο πίνακας τάξη σε αυτό.

930
00:45:01,710 --> 00:45:03,150
>> Ίδια πράγματα για τα κουμπιά.

931
00:45:03,150 --> 00:45:12,140
Αν απλά προσθέστε το BTN τάξη και BTN
υπεκφεύγουν ή BTN πρωτοβάθμια, μπορείτε να

932
00:45:12,140 --> 00:45:16,240
πάρετε οποιοδήποτε από αυτά τα κουμπιά
με αυτές τις προ-made στυλ.

933
00:45:16,240 --> 00:45:18,570
Και τότε, αν ψάχνετε για
κάτι πιο σύνθετο από την απλή

934
00:45:18,570 --> 00:45:24,100
επανασχεδιασμό τι w ήδη, πάνω σε
η καρτέλα JavaScript σε όλη την κορυφή τον

935
00:45:24,100 --> 00:45:25,120
έχουν μια δέσμη των συστατικών.

936
00:45:25,120 --> 00:45:30,410
>> Έτσι, εδώ έχουμε μεταβάσεις, modals,
αναπτυσσόμενα μενού, καρτέλες, και επεξηγήσεις.

937
00:45:30,410 --> 00:45:35,530
Μια tooltip είναι ό, τι αναδύεται κάτω από σας
ποντικιού όταν περνάτε σε κάτι.

938
00:45:35,530 --> 00:45:40,280
Popovers, ειδοποιήσεις, κουμπιά, πτυσσόμενο
ακορντεόν είναι ό, τι

939
00:45:40,280 --> 00:45:41,190
από όπου και αν συνήθως ονομάζεται.

940
00:45:41,190 --> 00:45:43,045
Καρουσέλ, το οποίο κτύπημα
μέσα, όπως εικόνες.

941
00:45:43,045 --> 00:45:52,190

942
00:45:52,190 --> 00:45:54,840
>> Έτσι, αυτά είναι τα συστατικά
Ωκεανογραφία.

943
00:45:54,840 --> 00:45:57,620
Θα ήθελα να σας ενθαρρύνω να
ιδιαίτερα πηγαίνετε να δείτε σε αυτά.

944
00:45:57,620 --> 00:46:01,780
Υπάρχει ένα συστατικό JavaScript
και ένα συστατικό CSS.

945
00:46:01,780 --> 00:46:03,880
Μη διστάσετε να τα χρησιμοποιήσετε όπως εσείς θα.

946
00:46:03,880 --> 00:46:06,730
Εμείς δεν πρόκειται να πάμε πάρα πολύ σε αυτά
γιατί αισθανόμαστε την τεκμηρίωση

947
00:46:06,730 --> 00:46:09,360
είναι πολύ καλά κάνει.

948
00:46:09,360 --> 00:46:10,540
Και ναι.

949
00:46:10,540 --> 00:46:14,500
Έχετε απορίες σχετικά με αυτό;

950
00:46:14,500 --> 00:46:19,430
>> MIKE RIZZO: Έτσι, ως είναι πραγματικά γρήγορα
πλευρά, ο σχεδιασμός αυτής της ιστοσελίδας που

951
00:46:19,430 --> 00:46:21,830
μπορούμε γρήγορα βάλει μαζί για
αυτή η παρουσίαση είναι

952
00:46:21,830 --> 00:46:24,290
στην πραγματικότητα γίνεται με τη χρήση Bootstrap.

953
00:46:24,290 --> 00:46:27,810
Όπως μπορείτε να δείτε, όταν κάνουμε κλικ σε αυτά
διαφορετικές καρτέλες, ποτέ δεν είμαστε πραγματικά

954
00:46:27,810 --> 00:46:30,750
αφήνοντας αυτό το ρεύμα σελίδα index.html.

955
00:46:30,750 --> 00:46:36,400
Έτσι, αυτό που έχουμε είναι διαφορετική divs
εντός αυτής index.html.

956
00:46:36,400 --> 00:46:39,610
Και στη συνέχεια, κάθε φορά που κάνετε κλικ σε ένα διαφορετικό
καρτέλα, είναι απλά μια αλλαγή

957
00:46:39,610 --> 00:46:41,590
η οποία δείχνει κάποιου.

958
00:46:41,590 --> 00:46:47,390
>> Γι 'αυτό τις θέσεις τους ανάλογα,
αλλάζει τον κώδικα HTML της σελίδας, έτσι ώστε

959
00:46:47,390 --> 00:46:52,330
την τρέχουσα καρτέλα έχει επισημανθεί ως ενεργό, ώστε
εμφανίζεται με διαφορετικό τρόπο και εμφάνιση

960
00:46:52,330 --> 00:46:52,820
πολύ ωραία.

961
00:46:52,820 --> 00:46:57,260
>> ΤΟΜΑΣ REIMERS: Έτσι ώστε ήταν όλα γίνονται
χωρίς να γράφουμε σχεδόν κάθε CSS.

962
00:46:57,260 --> 00:47:01,440
Μπορούμε επίσης να δούμε μια κεφαλίδα πέρα ​​από την κορυφή,
που τα χρώματα είναι από εμάς.

963
00:47:01,440 --> 00:47:04,800
Όμως, η πραγματική βάζοντας σχετικά με την
επάνω μέρος της σελίδας και κάνοντας

964
00:47:04,800 --> 00:47:06,660
το πάπυρος ήταν Bootstrap.

965
00:47:06,660 --> 00:47:09,720
Και τότε, ακόμη και για μια άλλη βιβλιοθήκη - αυτό
Δεν είναι ένα μιλήσαμε για ένα, αλλά

966
00:47:09,720 --> 00:47:11,580
μπορείτε να το Google, αν θέλετε.

967
00:47:11,580 --> 00:47:15,130
Αυτό ονομάζεται prettify.js.

968
00:47:15,130 --> 00:47:20,650
Και θα την σύνταξη τονίσει τον κωδικό σας
για σας χρησιμοποιώντας τόσο CSS και JavaScript.

969
00:47:20,650 --> 00:47:23,480

970
00:47:23,480 --> 00:47:27,070
>> Το τελευταίο πράγμα που θέλουμε να μιλήσουμε για
πριν αφήσετε έξω στο το

971
00:47:27,070 --> 00:47:30,620
κόσμο για να εξετάσουμε τις βιβλιοθήκες να καταλάβω
πώς να τα χρησιμοποιούν και να, ελπίζω,

972
00:47:30,620 --> 00:47:34,640
διαβάσετε τα έγγραφα και να βρείτε αυτό που
ανάγκη είναι πώς να βρει τις βιβλιοθήκες.

973
00:47:34,640 --> 00:47:37,000
Έτσι, το πρώτο είναι ότι είμαστε μόνο
πρόκειται να ωθήσει το Google.

974
00:47:37,000 --> 00:47:37,810
Μετάβαση Google.

975
00:47:37,810 --> 00:47:41,150
>> Αυτό είναι κυριολεκτικά ό, τι κάνουμε όταν
Πρέπει να κάνουμε κάτι εμείς Google.

976
00:47:41,150 --> 00:47:44,730
Είναι μια βιβλιοθήκη JavaScript εκεί που
μου επιτρέπει να χειριστείτε το χρόνο σε ένα

977
00:47:44,730 --> 00:47:45,400
χρήσιμο τρόπο;

978
00:47:45,400 --> 00:47:49,510
Έτσι, αν ξέρω ότι κάποιος χρήστης δημιουργεί
λογαριασμό εδώ, και αυτό είναι το

979
00:47:49,510 --> 00:47:53,010
τρέχουσα ώρα, πως μπορώ να υπολογίσω το
διαφορά με εκείνη χωρίς να χρειάζεται να

980
00:47:53,010 --> 00:47:55,020
υπολογίζει τον εαυτό μου;

981
00:47:55,020 --> 00:47:59,630
Έτσι, αυτό είναι πραγματικά ένα κοινό πράγμα,
Βιβλιοθήκης JavaScript χρόνο.

982
00:47:59,630 --> 00:48:02,440
Και εδώ έχουμε Moment.js--
η πιο δημοφιλής.

983
00:48:02,440 --> 00:48:06,530
>> Αν χρειαζόμαστε μια βιβλιοθήκη να χειραγωγήσουν
κάτι σαν το χρώμα να είναι σε θέση να

984
00:48:06,530 --> 00:48:08,650
δημιουργήσει μια δέσμη των τυχαίων χρωμάτων -

985
00:48:08,650 --> 00:48:10,660
ενδεχομένως, να δημιουργήσει ένα
στυλ ή κάτι τέτοιο -

986
00:48:10,660 --> 00:48:13,480
θα μπορούσαμε να το Google κάτι σαν
JavaScript χρώμα της βιβλιοθήκης.

987
00:48:13,480 --> 00:48:15,620
Και είμαι σίγουρος ότι θα αναδυθεί με την
χίλιοι και ένας από αυτούς.

988
00:48:15,620 --> 00:48:18,290

989
00:48:18,290 --> 00:48:21,410
Είστε ευπρόσδεκτοι να διαβάσετε μέσα από αυτά.

990
00:48:21,410 --> 00:48:24,610
>> Έτσι, τα περισσότερα πράγματα - όταν τους βρείτε -
πρόκειται να φιλοξενηθεί σε ένα από τα

991
00:48:24,610 --> 00:48:25,920
sites τα οποία κωδικοποιούν υποδοχής.

992
00:48:25,920 --> 00:48:26,960
Είναι είναι μερικές δημοφιλείς.

993
00:48:26,960 --> 00:48:30,870
Το πιο δημοφιλές, με
τώρα, είναι github.com.

994
00:48:30,870 --> 00:48:35,300
Και αν πάτε σε GitHub είναι πραγματικά
όπου Normalize φιλοξενήθηκε.

995
00:48:35,300 --> 00:48:36,950
Έτσι, εάν θέλετε να πάτε πίσω σε αυτό.

996
00:48:36,950 --> 00:48:38,135
Δείξτε τους ότι.

997
00:48:38,135 --> 00:48:40,516
>> MIKE RIZZO: Και αυτό είναι στην πραγματικότητα, όπου
αυτό φιλοξενείται πάρα πολύ, αν έχετε παρατηρήσει.

998
00:48:40,516 --> 00:48:41,000
>> ΤΟΜΑΣ REIMERS: Ναι.

999
00:48:41,000 --> 00:48:49,078
Έτσι, αν πάτε πάνω να ομαλοποιήσει
και να πάει στο GitHub.

1000
00:48:49,078 --> 00:48:51,936
Ήταν είναι αυτό;

1001
00:48:51,936 --> 00:48:54,620
>> MIKE RIZZO: Αυτό το μικρό πράγμα γάτα
είναι το σύμβολο GitHub.

1002
00:48:54,620 --> 00:48:56,330
>> ΤΟΜΑΣ REIMERS: Αχ.

1003
00:48:56,330 --> 00:49:02,180
Έτσι GitHub χρησιμοποιεί μια μέθοδο που ονομάζεται
Git με τον κωδικό κατάστημα.

1004
00:49:02,180 --> 00:49:05,150
Είναι δεν ξέρετε τι είναι ή
σας φοβίζει, αυτό είναι εντάξει.

1005
00:49:05,150 --> 00:49:16,100
Δεν χρειάζεται να ξέρετε τι είναι Git
επειδή GitHub έχει ένα κουμπί Download

1006
00:49:16,100 --> 00:49:17,200
στην κάτω δεξιά γωνία.

1007
00:49:17,200 --> 00:49:21,350
>> Το άλλο χρήσιμο πράγμα που πρέπει να ξέρετε
για GitHub είναι τα περισσότερα προϊόντα

1008
00:49:21,350 --> 00:49:23,200
θα έχουν διαβάσει μου.

1009
00:49:23,200 --> 00:49:25,400
Και εάν δεν έχετε έναν ιστοχώρο, η
διαβάστε μου, θα μιλήσουμε για το πώς θα

1010
00:49:25,400 --> 00:49:28,310
εγκαταστήσετε, πώς μπορείτε να το χρησιμοποιήσετε, τι
κάνει, κ.λπ., κ.λπ., κ.λπ..

1011
00:49:28,310 --> 00:49:31,033
Τι έχουμε ουσιαστικά ήταν
τα πόδια σας μέσα.

1012
00:49:31,033 --> 00:49:32,326
>> MIKE RIZZO: εγκατάλειψη του Διαδικτύου.

1013
00:49:32,326 --> 00:49:34,020
>> ΤΟΜΑΣ REIMERS: Αυτό είναι εντάξει.

1014
00:49:34,020 --> 00:49:36,980
Τα τελευταία δύο πράγματα που θέλαμε
να μιλήσουμε για -

1015
00:49:36,980 --> 00:49:38,750
έχουμε μιλήσει για το Git -

1016
00:49:38,750 --> 00:49:40,290
είναι αντιμετώπισης προβλημάτων.

1017
00:49:40,290 --> 00:49:43,020
Και αυτό δεν είναι που έχει σημασία για
το τελικό προϊόν, όπως είναι

1018
00:49:43,020 --> 00:49:44,870
όταν φεύγετε από 50.

1019
00:49:44,870 --> 00:49:48,310
Και όταν τρέχετε σε προϊόντα
εφαρμογής βιβλιοθήκες ή την εφαρμογή

1020
00:49:48,310 --> 00:49:50,230
το δικό σας έργο, θα πάμε
να έχετε ερωτήσεις ή είστε

1021
00:49:50,230 --> 00:49:51,660
πρόκειται να δούμε για τις ερωτήσεις.

1022
00:49:51,660 --> 00:49:53,060
>> Και πάλι, το Google.

1023
00:49:53,060 --> 00:49:54,630
Αυτό είναι κυριολεκτικά ό, τι κάνουμε.

1024
00:49:54,630 --> 00:49:56,400
Αυτό πρόκειται να ακούγεται ανόητο.

1025
00:49:56,400 --> 00:49:58,310
Όμως, κυριολεκτικά, θα το Google.

1026
00:49:58,310 --> 00:50:01,810
Και ξανά, ένα από τα πρώτα πράγματα
θα τρέξει συνήθως σε είναι

1027
00:50:01,810 --> 00:50:06,550
stackoverflow.com, η οποία είναι μια θαυμάσια
ερωτήσεων και απαντήσεων θέαμα.

1028
00:50:06,550 --> 00:50:10,530
>> Είναι υπέροχο, τόσο επειδή μπορείτε να
μετά τις ερωτήσεις και να αναζητήσουν

1029
00:50:10,530 --> 00:50:12,760
απαντήσεις, αλλά και επειδή
έχει ήδη πολλά

1030
00:50:12,760 --> 00:50:14,590
προσυμπληρωμένη περιεχόμενο που υπάρχει εκεί.

1031
00:50:14,590 --> 00:50:18,510
Έτσι, συνήθως όταν έχετε το Google ένα προγραμματισμό
ζήτημα στο πλαίσιο του πρώτου

1032
00:50:18,510 --> 00:50:22,620
ζευγάρι χτυπά μπορεί να έχετε ήδη τρέξει
σε αυτό κατά τη διάρκεια του προβλήματος σύνολα σας.

1033
00:50:22,620 --> 00:50:27,840
>> Και στη συνέχεια, η τελευταία πραγματικά σύντομη πράγμα
είναι JSFIDDLE, η οποία είναι - σήμερα έχουμε

1034
00:50:27,840 --> 00:50:32,110
έχουν κάνει πολλή δουλειά με
HTML CSS JavaScript.

1035
00:50:32,110 --> 00:50:39,820
JSFIDDLE είναι ένα web app, η οποία ουσιαστικά
σας επιτρέπει να πάρετε HTML σας, ΣΑΣ

1036
00:50:39,820 --> 00:50:42,820
Η Javascript κάτω αριστερά, και
CSS πάνω δεξιά σας.

1037
00:50:42,820 --> 00:50:47,840
Και τότε μπορεί να δημιουργήσει μια γρήγορη καθιστούν
από αυτό και να δούμε πώς θα αλληλεπιδρά.

1038
00:50:47,840 --> 00:50:50,500
Είναι πολύ χρήσιμο όταν οι άνθρωποι προσπαθούν
να κάνει μια απόδειξη της έννοιας, όπως

1039
00:50:50,500 --> 00:50:52,910
αυτό είναι το πώς θα κάνατε
κάνει ένα drop down μενού.

1040
00:50:52,910 --> 00:50:54,980
Ίσως μια γρήγορη αποκάλυψη ή οτιδήποτε άλλο.

1041
00:50:54,980 --> 00:50:56,560
>> MIKE RIZZO: Οπότε ας πάμε
μπροστά και να κάνετε κλικ σε αυτό.

1042
00:50:56,560 --> 00:50:57,820
Μια γρήγορη σημείωση -

1043
00:50:57,820 --> 00:51:00,430
λαμβάνοντας υπόψη ότι, πριν ήμασταν
να κάνει με κλικ.

1044
00:51:00,430 --> 00:51:04,380
Βγάζει JCorey Κορέα έχει επίσης ένα ενσωματωμένο
σε κλικ χειρισμού συμβάντων που

1045
00:51:04,380 --> 00:51:07,020
χρησιμοποιεί μόνο επειδή πρόκειται για έναν είσαι
πρόκειται να θελήσετε να κάνετε πολλά πράγματα

1046
00:51:07,020 --> 00:51:08,410
όταν θέλετε να κάνετε κλικ σε κάτι.

1047
00:51:08,410 --> 00:51:09,690
>> Ομοίως, έχει επίσης ένα hover.

1048
00:51:09,690 --> 00:51:12,850
Αλλά για να πάρετε το πλήρες φάσμα των
εκείνους, να δούμε την jQuery

1049
00:51:12,850 --> 00:51:15,320
τεκμηρίωση και να το κάνουμε.

1050
00:51:15,320 --> 00:51:18,760
Έκανα κάτι ηλίθιο εδώ.

1051
00:51:18,760 --> 00:51:21,490
>> ΤΟΜΑΣ REIMERS: Έτσι έχω μια πραγματικά γρήγορη
το πρόγραμμα εδώ, που λέει

1052
00:51:21,490 --> 00:51:22,640
κουμπί κλικ.

1053
00:51:22,640 --> 00:51:23,890
Στη συνέχεια έχουμε ένα βρόχο.

1054
00:51:23,890 --> 00:51:26,810
Για i είναι μικρότερο από 404.

1055
00:51:26,810 --> 00:51:29,530
Είναι ακριβώς πρόκειται να αναδυθεί
αυτά τα μηνύματα ειδοποίησης.

1056
00:51:29,530 --> 00:51:33,425
>> MIKE RIZZO: Και ποια ήταν η
κωδικός 404 ανήλθε στο HTML;

1057
00:51:33,425 --> 00:51:34,145
Υπάρχει κάποιος που θυμάται;

1058
00:51:34,145 --> 00:51:35,450
Δεν βρέθηκε, σωστά.

1059
00:51:35,450 --> 00:51:38,640

1060
00:51:38,640 --> 00:51:40,885
Chrome πρόσθεσε επίσης αυτό το τακτοποιημένο
το πράγμα, όπου μπορείτε -

1061
00:51:40,885 --> 00:51:43,430
>> ΤΟΜΑΣ REIMERS: Επειδή οι άνθρωποι, όπως
Mike άρχισε να κάνει αυτό το πολύ και

1062
00:51:43,430 --> 00:51:47,230
ενοχλητικό χρήστες, το οποίο επιτρέπει
μπορείτε να δείτε πληροφορίες.

1063
00:51:47,230 --> 00:51:48,286
>> MIKE RIZZO: Ναι.

1064
00:51:48,286 --> 00:51:50,690
>> ΤΟΜΑΣ REIMERS: Μήπως έχουμε οποιεσδήποτε ερωτήσεις
γι 'αυτό, περίπου JavaScript

1065
00:51:50,690 --> 00:51:53,420
βιβλιοθήκες, βρίσκοντας βιβλιοθήκες, ή
τι ανάπτυξης ιστοσελίδων εμφάνιση

1066
00:51:53,420 --> 00:51:55,400
όπως και στον πραγματικό κόσμο;

1067
00:51:55,400 --> 00:51:56,880
Είμαστε τρέχει μέχρι ενάντια στο χρόνο.

1068
00:51:56,880 --> 00:52:00,400
Έτσι, δεν είμαι σίγουρος ότι θα πάμε
να έχουν το χρόνο να εφαρμόσει

1069
00:52:00,400 --> 00:52:02,290
εκτός αν είναι πραγματικά γρήγορα.

1070
00:52:02,290 --> 00:52:04,580
Είμαστε εντάξει;

1071
00:52:04,580 --> 00:52:08,110
>> MIKE RIZZO: Ό, τι εσείς θα θέλατε
για να δούμε πραγματικά γρήγορα μέσα, όπως, δύο

1072
00:52:08,110 --> 00:52:09,556
λεπτά ή λιγότερο;

1073
00:52:09,556 --> 00:52:10,870
>> ΤΟΜΑΣ REIMERS: Οτιδήποτε
μπορούμε να διευκρινίσει;

1074
00:52:10,870 --> 00:52:12,500
Πώς να γράψετε -

1075
00:52:12,500 --> 00:52:13,260
>> ΚΟΙΝΟ: [δεν ακούγεται];

1076
00:52:13,260 --> 00:52:16,070
>> MIKE RIZZO: Ναι, έτσι that's -

1077
00:52:16,070 --> 00:52:18,065
>> ΤΟΜΑΣ REIMERS: Μπορείτε απλά να πατήσετε
Έλεγχος-U στην ιστοσελίδα.

1078
00:52:18,065 --> 00:52:19,275
>> MIKE RIZZO: Ω, δεν το ήξερα αυτό.

1079
00:52:19,275 --> 00:52:22,290
>> ΤΟΜΑΣ REIMERS: Νομίζω, ναι.

1080
00:52:22,290 --> 00:52:23,300
Έλεγχος-U. Ναι.

1081
00:52:23,300 --> 00:52:25,970
>> MIKE RIZZO: Ω, έτσι ώστε να είναι η
κώδικα για την ιστοσελίδα.

1082
00:52:25,970 --> 00:52:29,580
Αλλά εάν θέλετε πραγματικά να κάνετε λήψη μας
τα αρχεία και τα πάντα, φιλοξενείται

1083
00:52:29,580 --> 00:52:32,650
για github.com

1084
00:52:32,650 --> 00:52:34,850
>> ΤΟΜΑΣ REIMERS: slash το όνομά μου -

1085
00:52:34,850 --> 00:52:38,504
Tomas Reimers - slash
Σεμινάριο CS50 παύλα.

1086
00:52:38,504 --> 00:52:40,710
>> MIKE RIZZO: Και μπορείτε να
βρείτε τα πάντα.

1087
00:52:40,710 --> 00:52:42,310
>> ΤΟΜΑΣ REIMERS: Αυτό είναι ό, τι GitHub
Μοιάζει, από τον τρόπο.

1088
00:52:42,310 --> 00:52:44,910
Έτσι και πάλι, όταν βλέπετε ένα open source
του έργου, συνήθως, θα είναι μια ανάγνωση

1089
00:52:44,910 --> 00:52:45,950
Θέλω εκεί που μπορείτε να διαβάσετε.

1090
00:52:45,950 --> 00:52:50,200
Και αν πάμε πίσω, θα παρατηρήσετε ότι
έχετε το κατεβάσετε zip, το οποίο θα

1091
00:52:50,200 --> 00:52:52,130
σας επιτρέπει να κατεβάσετε τον πηγαίο κώδικα
κώδικα για να περιλαμβάνουν τα

1092
00:52:52,130 --> 00:52:53,666
προϊόν το δικό σας.

1093
00:52:53,666 --> 00:52:56,890
>> MIKE RIZZO: Ναι, και αν εμείς απλά κάντε κλικ στο κουμπί
στις index.html πολύ γρήγορα -

1094
00:52:56,890 --> 00:52:59,180
>> ΤΟΜΑΣ REIMERS: Θα δείτε εδώ είναι το
πηγαίου κώδικα για την ιστοσελίδα μας.

1095
00:52:59,180 --> 00:53:02,016

1096
00:53:02,016 --> 00:53:06,070
>> MIKE RIZZO: Επίσης, ξέχασα να ωθήσει δεξιά
πριν με το μεγάλο τραπέζι που

1097
00:53:06,070 --> 00:53:09,860
περιλαμβάνονται, αλλά υπάρχει επίσης ένα τραπέζι
των chmods που περιλαμβάνονται

1098
00:53:09,860 --> 00:53:13,210
μόνο για τη σαφήνειά σας.

1099
00:53:13,210 --> 00:53:16,940
Αλλά αν μετακινηθείτε σε όλη τη διαδρομή προς το
κάτω, δεν είχαμε πραγματικά να κάνουμε πολύ

1100
00:53:16,940 --> 00:53:21,160
πολύ με το JavaScript
τα πράγματα καθόλου με αυτό.

1101
00:53:21,160 --> 00:53:26,610
Είναι αποκλειστικά και μόνο από τα πάντα
άλλο που είχαμε.

1102
00:53:26,610 --> 00:53:28,730
>> Έτσι σας ευχαριστήσω που ήρθατε
και να ακούτε.

1103
00:53:28,730 --> 00:53:29,830
Ελπίζουμε ότι αυτό ήταν πραγματικά χρήσιμη.

1104
00:53:29,830 --> 00:53:33,020
Αν έχετε οποιαδήποτε JavaScript σχετικές
ερωτήσεις ή απλά θέλετε να μιλήσουμε για

1105
00:53:33,020 --> 00:53:36,240
τι άλλο σαν αυτό άλλα δροσερά πράγματα
μπορείτε να κάνετε με JavaScript, θα θέλαμε

1106
00:53:36,240 --> 00:53:37,186
να σου μιλήσω.

1107
00:53:37,186 --> 00:53:40,010
>> ΤΟΜΑΣ REIMERS: Εάν έχετε μια ερώτηση
για το έργο σας ή αν αυτό μπορεί να είναι

1108
00:53:40,010 --> 00:53:42,740
περίπτωση, θα χρειαστεί κατά πάσα πιθανότητα να μείνω
λίγο μετά από αυτό.

1109
00:53:42,740 --> 00:53:44,640
Αλλά εκτός από αυτό, έχουν
ένα καλό Σαββατοκύριακο.

1110
00:53:44,640 --> 00:53:45,845
>> MIKE RIZZO: Ναι, μπορείτε να απολαύσετε.

1111
00:53:45,845 --> 00:53:46,120
Τα λέμε.

1112
00:53:46,120 --> 00:53:47,370
>> ΤΟΜΑΣ REIMERS: Τα λέμε.

1113
00:53:47,370 --> 00:53:47,926