1
00:00:01,470 --> 00:00:02,790
Tekrar hoşgeldiniz.

2
00:00:02,790 --> 00:00:05,340
Dolayısıyla bu video biraz farklı olacak.

3
00:00:05,340 --> 00:00:09,750
Dom'u manipüle etmenin yeni yollarını tanıtmayacağız, ancak öğrendiklerimizi alıp birlikte

4
00:00:09,780 --> 00:00:11,410
biraz bir kod yapacağız.

5
00:00:11,640 --> 00:00:13,860
Dolayısıyla Google'ın ana sayfasını kullanacağız.

6
00:00:13,950 --> 00:00:18,990
Bu nedenle Google'ı açmanızı ya da bunu benimle birlikte yapmanızı veya videoyu izledikten sonra kendi

7
00:00:18,990 --> 00:00:20,080
başınıza yapmanızı öneriyorum.

8
00:00:20,340 --> 00:00:23,780
Ve biz sadece logoyu değiştirmek gibi eğlenceli şeyler yapacağız.

9
00:00:23,940 --> 00:00:28,530
Bir kedi yavrusu resmini yapacağız, sadece bu kedi severlerin adil olabilmesi için,

10
00:00:28,530 --> 00:00:32,220
tüm bağlantıları değiştirecek ve böylelikle benzer bir nokta haline geldiler.

11
00:00:32,250 --> 00:00:37,410
Bu derste vurgulamak istediğim nokta, birden çok öğeyi değiştirmek için bir döngü kullanabileceğiz,

12
00:00:37,410 --> 00:00:42,810
böylece her zaman bir şey seçip renklerini değiştirmemizi veya bir resim seçip kaynağını

13
00:00:42,810 --> 00:00:43,710
değiştirmemizi sağlıyoruz.

14
00:00:43,770 --> 00:00:49,440
Tüm görüntüleri seçebilir ve ardından bu listede döngü yapabiliriz ve her biri kendi kaynağını değiştiririz.

15
00:00:49,470 --> 00:00:51,080
Bu yüzden sana burada nasıl yapacağımı göstereceğim.

16
00:00:51,300 --> 00:00:52,790
Bu yüzden basit başlayacağız.

17
00:00:53,100 --> 00:00:55,050
Bu logoyu seçerek başlayalım.

18
00:00:55,380 --> 00:01:00,480
Ayrıca, bu düzenli logonun yerine bir Google Doodle'ı olan bir günde Google'da olmanızın yanısıra

19
00:01:00,480 --> 00:01:01,730
bir de kısa not.

20
00:01:01,860 --> 00:01:03,640
Burada bir görüntü olmayabilir.

21
00:01:03,780 --> 00:01:06,850
Bazen fantezi animasyonlar veya etkileşimli oyunlar var.

22
00:01:06,930 --> 00:01:10,390
Ve bu durumda tuval unsuru gibi bir şey olabilirler.

23
00:01:10,470 --> 00:01:14,980
Dolayısıyla, bu işi yaparsanız, bu bölümü inceleyince bu bölümü seyredebilirsiniz.

24
00:01:15,010 --> 00:01:19,650
gördük, ancak bunu herkesin web sitesinde yapabileceğinizi göstermek için seçeceğim.

25
00:01:19,690 --> 00:01:22,100
Görüntü kaynaklarını nasıl değiştireceğinizi zaten

26
00:01:22,530 --> 00:01:26,680
Bu bir görüntü ve kolaylaştıran bir kimliği var.

27
00:01:26,850 --> 00:01:28,290
HP logosu.

28
00:01:28,410 --> 00:01:34,100
Bu nedenle, seçici hp logosunu sorgulayan, logo eşdeğeri belge olarak

29
00:01:37,320 --> 00:01:38,660
adlandıralım seçelim.

30
00:01:38,880 --> 00:01:42,090
Ve elbette, elementi ID olarak da kullanabilirdik.

31
00:01:42,390 --> 00:01:46,210
Böylece Logo ile eşit oluruz.

32
00:01:46,320 --> 00:01:47,890
Bu yüzden şimdi seçtik.

33
00:01:48,030 --> 00:01:51,540
Ve görüntüyü değiştirmek istiyorsak, kaynağı değiştireceğiz.

34
00:01:51,540 --> 00:01:55,530
Set niteliğini kullanmamız gerekiyor ve sadece görüntü var burada.

35
00:01:56,190 --> 00:01:57,650
Güzel kedi yavrusu.

36
00:01:57,660 --> 00:01:59,070
Bu yüzden ben de şu Kidan'ı alacağım.

37
00:01:59,060 --> 00:02:04,540
Bunu kopyalayacağım ve bunu yapmak için bu logonun güncelleneceğim.

38
00:02:04,650 --> 00:02:10,210
Korku yerine logo dot set özniteliği yapın.

39
00:02:10,380 --> 00:02:12,630
Sadece kaynak yazacağız.

40
00:02:12,810 --> 00:02:20,420
Ve ikinci argüman yeni kaynak ve ben girmek vurdu ve benim güzel küçük kedi Roquette görünmesi olsun.

41
00:02:21,210 --> 00:02:22,760
Böyle bir mesaj alabilirsiniz.

42
00:02:22,860 --> 00:02:24,720
Kullandığınız görüntüye bağlı olarak.

43
00:02:24,900 --> 00:02:26,770
Bu yüzden kısaca bunun ne olduğunu açıklayacağım.

44
00:02:26,910 --> 00:02:33,300
Sadece görünen TTP ile yüklü bir sayfada olduğumuzdan ve kaynağı B olarak

45
00:02:33,300 --> 00:02:36,470
ayarladığınız resmin H TTP olduğunu belirtiyor.

46
00:02:36,570 --> 00:02:40,700
Ve kısa yapmak HTP, HGP'den daha güvenlidir.

47
00:02:40,710 --> 00:02:46,400
Bu yüzden hepsinin HTP olmasından şikayetçi Evet, daha az güvenli bir şey kullanmamalıyız.

48
00:02:46,410 --> 00:02:49,560
Bu gerçekten basit bir versiyon ama yine de yapmamızı sağlıyor.

49
00:02:49,560 --> 00:02:53,630
Burada yapmaya çalıştığımız şey sadece Google ile oynarken büyük bir sorun değil.

50
00:02:53,670 --> 00:02:58,020
Bununla birlikte, kendi başvurunuzda böyle bir şey yapıp kullanmadığınızı düşünmek isteyen

51
00:02:58,020 --> 00:03:00,990
bir şey olsa da bir sorun olur.

52
00:03:01,020 --> 00:03:03,070
Yani içeriğe geri dönün.

53
00:03:03,280 --> 00:03:09,330
Bu kedinin genişliğini ve yüksekliğini değiştirerek orijinal Google logosunun yaptığı alan miktarını

54
00:03:09,570 --> 00:03:11,230
değiştirecek şekilde bulundu.

55
00:03:11,460 --> 00:03:19,800
Aslında yüksekliği 92, başlangıçta iki yüz yetmiş iki buldu.

56
00:03:20,280 --> 00:03:22,130
İşte burada oluyor.

57
00:03:22,170 --> 00:03:31,510
Bunu değiştirmek isteyip istemediğimi görebilirsiniz logo dot stili bir nokta ile çizgi çizip alabilir

58
00:03:31,530 --> 00:03:36,300
ve bunu sadece 500 piksel olarak değiştirebilirim.

59
00:03:36,810 --> 00:03:39,720
Uzandığını görebilir ve ben de aynı şeyi yapabilirim.

60
00:03:39,750 --> 00:03:41,530
Bin piksel olacak şekilde değiştir.

61
00:03:41,970 --> 00:03:45,750
Güzel bir streç pisi edin ve genişliği değiştirebiliriz.

62
00:03:45,870 --> 00:03:51,900
Yüksekliği kast edelim ve 500 ya da fakir kedi yapalım.

63
00:03:51,900 --> 00:03:55,410
Her yerinde uzanıyor.

64
00:03:55,590 --> 00:03:59,550
Öyleyse devam edin ve yüksekliği biraz daha uygun bir şeye ayarlayın.

65
00:03:59,730 --> 00:04:06,690
Yüksekliği yaklaşık 100 piksel ve genişliği yaklaşık 200

66
00:04:09,960 --> 00:04:13,070
olacak şekilde gidelim.

67
00:04:13,080 --> 00:04:16,590
Pekala, şimdi bizim için daha pratik yapmak için çalışacak.

68
00:04:16,590 --> 00:04:26,040
Ayrıca, o resimde bir sınır oluşturalım, böylece stil sınırı eşittir logo, iki piksel

69
00:04:26,040 --> 00:04:34,130
mavimsi bir sınır yapacağız ve bu resim çevresinde muhteşem ortağımız var.

70
00:04:34,410 --> 00:04:39,690
Şimdi, şimdi bir grup öğeyi aynı anda seçen ve başkalarını tek tek yapmak

71
00:04:39,690 --> 00:04:45,750
zorunda kalmadan manipüle etmek için bir döngü kullanan videonun başında tanıttığım şeye devam edelim.

72
00:04:45,750 --> 00:04:48,980
Yapacağımız şey, sayfadaki tüm çapa etiketlerini seçmek.

73
00:04:48,990 --> 00:04:50,740
Bu sayfada bir çok bağlantı var.

74
00:04:50,820 --> 00:04:56,600
Her birini alıp, ref özelliğini, nereye gitsinler, diğer web sitelerine

75
00:04:56,610 --> 00:04:57,290
yönlendiriyoruz.

76
00:04:57,510 --> 00:05:02,830
Başlamak için tüm çapa etiketlerini seçmemiz gerekiyor, bunun için bir sürü yöntemimiz var.

77
00:05:02,880 --> 00:05:07,170
Bağlantıları bağlar diye adlandıracağım ve belge yapacağız.

78
00:05:07,170 --> 00:05:15,540
Bir sorgu mektubu yapabiliriz ancak etiketlerle bağlantı etiketiyle elemanlar alacağım ve eğer bağlantılara

79
00:05:15,540 --> 00:05:23,470
bakarsak, bu sayfada çok fazla şey görebileceğimizi görebiliriz, böylece bunun üzerinden geçeceğiz.

80
00:05:23,550 --> 00:05:35,070
sadece bağlantı yapıp yapamayacağımızı belirten nokta set özniteliği, öznitelikte bir işlevi olmayan link başlattığını söyler.

81
00:05:35,070 --> 00:05:35,750
Biz

82
00:05:35,880 --> 00:05:40,860
Bunun nedeni, bahsedilen özellik yalnızca bağımsız öğeler ve bağlantılar üzerinde mevcut olmasıdır.

83
00:05:40,860 --> 00:05:42,640
Bu düğüm koleksiyonu mu var.

84
00:05:42,750 --> 00:05:47,960
Dolayısıyla, nesne gibi başka herhangi bir dizi üzerinden dönecekmiş gibi dolaşmam gerekiyor.

85
00:05:48,330 --> 00:05:51,590
Bu yüzden her biri için kullanamıyorum çünkü gerçek bir dizi değil.

86
00:05:51,660 --> 00:05:54,880
Dolayısıyla bir for döngüsü kullanmam gerekiyor veya teknik olarak while döngüsü kullanabiliyorum.

87
00:05:54,900 --> 00:05:56,310
Çoğu kişi bir for döngüsü kullanır.

88
00:05:56,490 --> 00:06:05,640
1 ekleyecek ve daha sonra döngü içinde her bir link linkine erişeceğiz Hi.

89
00:06:08,700 --> 00:06:14,160
Yani, sıfıra sıfır eşittir linkler bu uzunluk ve

90
00:06:14,340 --> 00:06:18,040
Ve sadece metin içeriğini basarak başlayalım.

91
00:06:18,060 --> 00:06:22,850
Bu metin içeriğini birbirine bağlar ve o günlüğünü iptal ederiz.

92
00:06:24,090 --> 00:06:28,710
Dolayısıyla bu, bir sürü öğe ile döngü oluşturan ve belki konsoldan basarak

93
00:06:28,710 --> 00:06:35,140
değil, bir şekilde göstererek veya rengini değiştiren bir şey değiştiren bir şey yaparak ortak bir desen.

94
00:06:35,420 --> 00:06:40,050
Bu yüzden enter'a basar ve bunun sayfadaki tüm linklerin metin içeriği olduğunu görebilirsiniz.

95
00:06:40,200 --> 00:06:46,320
Böylece fotoğraf gibi şeyleri bildireceğiz ve Google artı çevirme oynamaya başlayacağız. YouTube'un tüm bu bağlantıları bu sayfanın

96
00:06:46,320 --> 00:06:50,460
bir yerinde bulunuyor ve bu Google'ın ana sayfa olduğunu anlamanıza yardımcı oluyor.

97
00:06:50,520 --> 00:06:56,460
Dolayısıyla, yukarı okun bir parçasını basmaktan ve bu döngüye geri dönmektense,

98
00:06:56,460 --> 00:07:02,190
stilleri değiştirerek başlayalım; böylece uzunlukları daha kolay bir hale getirelim ve

99
00:07:02,610 --> 00:07:05,570
etraflarında bir sınır oluşturalım. .

100
00:07:05,910 --> 00:07:14,520
Bu yüzden konsolumun logundan kurtulacağım ve ben vaşak stili yapacağım ve arka

101
00:07:15,150 --> 00:07:19,990
planı başlayacak ve pembe hale getireceğiz.

102
00:07:20,800 --> 00:07:25,050
Ve içeri girersek, konsolu kapatacağımızı göreceksin.

103
00:07:25,080 --> 00:07:27,790
Sayfadaki tüm bağlantılar şimdi Pembe.

104
00:07:27,810 --> 00:07:29,120
Pembe bir arka plan var.

105
00:07:29,280 --> 00:07:31,680
Yani burada olan şey bir bağlantı.

106
00:07:31,750 --> 00:07:34,490
Bu nafların tamamı, oturum açma düğmesindeki öğelerdir.

107
00:07:34,830 --> 00:07:35,890
Ayrıca bir bağlantı.

108
00:07:36,270 --> 00:07:37,910
Bu yüzden bir şey daha yapalım.

109
00:07:38,010 --> 00:07:39,140
Hadi tekrar geçelim.

110
00:07:39,210 --> 00:07:43,870
Yukarı okuna basın ve birkaç şey yapalım o halde stil yapalım.

111
00:07:43,910 --> 00:07:52,060
Sınır bir piksele eşit ve mor koyu sarı yapalım.

112
00:07:52,410 --> 00:08:04,980
Ve bir sonraki satırda stil ve renk turuncu olacak şekilde değiştirelim.

113
00:08:05,520 --> 00:08:07,880
Böylece bu ikisi vurdu.

114
00:08:07,890 --> 00:08:14,820
Ayrıca, bu gerçekten güzel bağlantıları sayfanıza pembe arka planda, sadece normal bir sınır olmakla kalmayan küçük mor renkli sınıra

115
00:08:14,820 --> 00:08:16,010
da getireceğimizi görebilirsiniz.

116
00:08:16,110 --> 00:08:18,090
Çok gösterişli.

117
00:08:18,180 --> 00:08:20,610
Ve orada turuncu bir metin var.

118
00:08:21,240 --> 00:08:26,730
Ancak bunları tıklarsak, tuzakların henüz değişmediğini görebilir ve bu onları değiştirmediğimiz için

119
00:08:26,730 --> 00:08:27,640
mantıklı olur.

120
00:08:27,750 --> 00:08:31,230
Bu yüzden hepsini WDW'ye gitmek için değiştirmek istiyorum.

121
00:08:31,270 --> 00:08:36,590
Nokta haline gelmek, konferansa katılmak zorunda. Ve zaten bağlantılarım seçilmiştim.

122
00:08:36,630 --> 00:08:41,620
Bu devasa koleksiyonda zaten o döngü var ve bu yüzden onu tekrar kullanacağım.

123
00:08:42,540 --> 00:08:45,680
Ve bunu tekrarlamak sadece çok şey yapacak.

124
00:08:45,690 --> 00:08:51,070
Dolayısıyla, her biri için bir tane kullanamayacağımız bu dört döngüyü yazabiliyorsanız, rahat olun.

125
00:08:51,090 --> 00:08:52,610
Dolayısıyla bir for döngüsü kullanmak zorundayız.

126
00:08:52,680 --> 00:08:53,770
Bunu her zaman yaparız.

127
00:08:53,790 --> 00:08:59,050
Ve buradan itibaren Jey sorgusuna ulaşana kadar bu tür bir satıra çok şey yazacağız.

128
00:08:59,310 --> 00:09:02,080
Böylece biz de I'yi bağlayacağız.

129
00:09:02,430 --> 00:09:08,580
Ve biz de başlayacağız, ancak her ışığın gidip o günlüğü iptal ettiği yere basacağız.

130
00:09:10,050 --> 00:09:16,060
Ayrıca, atra'nın günlük kaydetme özelliğini iptal edeceğiz.

131
00:09:18,240 --> 00:09:19,770
Aynen böyle.

132
00:09:20,400 --> 00:09:25,740
Ve teknik olarak bunu icat etmemiz gerekmiyor, ancak sadece görebilmeniz sizin için daha kolay.

133
00:09:26,250 --> 00:09:33,990
Ve burada görmek için sürekli günlük kapanış metnini gözden kaçırıyoruz ve şimdi tüm bağlantıların bir

134
00:09:37,320 --> 00:09:40,290
listesini alıyoruz ve bazılarını görebildiğinizden ilginç.

135
00:09:40,380 --> 00:09:45,090
Bu, bu şeyin bağlantısını javascript ileri doğru sıfır veya hayırdır.

136
00:09:45,150 --> 00:09:53,280
bazıları buna benzer göreli yollardır ve burada bazıları burada olduğu gibi mutlaktır.

137
00:09:53,280 --> 00:10:01,710
Dolayısıyla bazıları sadece boştur, bazıları ayrı web sitelerine gitmeyen 8 Tref'le ya da

138
00:10:01,770 --> 00:10:02,310
TAMAM.

139
00:10:02,490 --> 00:10:04,730
Şimdi onları değiştirelim.

140
00:10:04,890 --> 00:10:11,230
Compton-Rock blog bağlantıları özniteliği ayarladım ve sürekli olarak set özniteliğini günlüğe kaydettirmek zorunda değilsiniz.

141
00:10:11,430 --> 00:10:17,400
Ve onları HPF'yi W olarak değiştirmek istediğimiz HGF olarak değiştirmek istiyoruz. W. İşte böyle HTP kolon eğik çizgi BW nokta Bing dot com bunu yapıyor.

142
00:10:17,430 --> 00:10:25,930
Ve içeri girdik.

143
00:10:26,340 --> 00:10:27,930
Hiçbir şey değişmiş gibi görünmüyor.

144
00:10:27,930 --> 00:10:29,570
Bağlantılar yazarsak, sahip olduğumuz şeylere bakarız.

145
00:10:29,880 --> 00:10:32,650
Artık her biri nokta com olmaya

146
00:10:32,820 --> 00:10:40,110
gider ve biz de bir inceleyebiliriz ve eleman müfettişi görebilirsiniz dot com olmak gider.

147
00:10:40,110 --> 00:10:42,480
Ve bunu test etmek için yaptığımız son şey bir tane seçmektir.

148
00:10:42,780 --> 00:10:45,870
Bu yüzden hızlıca oturum açma düğmesini tıklayın veya Gmail'den çıkalım ve bunun benim için olduğu kadar açıldığını görebilirsiniz.

149
00:10:45,990 --> 00:10:52,860
Özetlemek gerekirse, bir sürü şey seçtik ve bir toplama koleksiyonu seçtik ve

150
00:10:53,580 --> 00:10:59,730
o koleksiyonda bir for döngüsü ile döngü kurduk ve sonra for

151
00:10:59,790 --> 00:11:05,580
döngüsü içerisinde her bir öğeye bir şeyler yapıp hepsine tekrar edeceğiz.

152
00:11:05,580 --> 00:11:07,470
20-30 fark uzunluğunu bilmediğim için uygulandı.

153
00:11:07,500 --> 00:11:14,310
Arka plan rengini kenar boşluğunu yazı tipi rengini değiştirdim ve ref değerini değiştirdik ve sadece birkaç satır yazmak zorunda kaldık ve bu sayfada

154
00:11:14,310 --> 00:11:19,500
Bu, önümüzdeki birkaç videoda çok şey kullanacağımız bir model.

155
00:11:19,500 --> 00:11:22,470