1
00:00:00,380 --> 00:00:02,130
さて、戻ってきます。

2
00:00:02,130 --> 00:00:05,070
だから私はあなた自身でこのショットのいくつかを与える時が来たと思う。

3
00:00:05,400 --> 00:00:07,310
だから私はすぐに運動をする。

4
00:00:07,560 --> 00:00:14,730
あなたがする必要があることは、新しい年齢を作成するか、新しいjavascriptファイルをファイルし、年齢に単一のボタンをファイルに追加することです。

5
00:00:14,730 --> 00:00:15,620
 

6
00:00:15,630 --> 00:00:16,920
それでおしまい。

7
00:00:16,920 --> 00:00:23,490
そして、そのボタンをクリックすると、体の背景色を白から紫に変えるだけです。

8
00:00:23,490 --> 00:00:24,780
 

9
00:00:24,780 --> 00:00:25,600
あなたはどうやってそれをやるの？

10
00:00:25,600 --> 00:00:27,190
私はそれをあなたに任せます。

11
00:00:27,240 --> 00:00:31,620
 

12
00:00:31,620 --> 00:00:36,570
 

13
00:00:36,570 --> 00:00:41,280
これまでに説明したさまざまなことを考えれば、いくつかの方法がありますが、ボタンをクリックするといくつかのコードを実行する必要があり、コードは2色の間で背景色を変更する必要があります。白いか、より良い色を選んでください。

14
00:00:41,280 --> 00:00:42,220
完全にあなたまで。

15
00:00:42,510 --> 00:00:44,010
だから今Pasicのビデオ。

16
00:00:44,190 --> 00:00:45,560
あなた自身でそれを与える。

17
00:00:45,580 --> 00:00:50,160
あなたがそれをして準備ができたら戻ってくることが本当に重要です。私たちは一緒に解決策を検討します。

18
00:00:50,160 --> 00:00:52,460
 

19
00:00:54,620 --> 00:00:55,280
OK。

20
00:00:55,350 --> 00:00:58,110
それで、この仕事をどうやって作るのか話しましょう。

21
00:00:58,110 --> 00:01:04,870
最初に私が必要とする女性のファイルが必要です。HMOを追加する必要があります。

22
00:01:05,310 --> 00:01:14,550
このカラートグルと呼んでみましょう。私たちが必要とするのはボタン1つで、私はちょうどそのような私をクリックして追加します。

23
00:01:14,550 --> 00:01:16,590
 

24
00:01:16,650 --> 00:01:22,850
今はjavascriptファイルが必要です。ここにスクリプトタグを追加するだけで、javascriptでは簡単に何かを行うことができますが、それは素晴らしい方法ではありません。

25
00:01:22,860 --> 00:01:27,260
 

26
00:01:27,270 --> 00:01:34,170
ちょうどあなたを正しい習慣に入れて新しいファイルを作成するには、単にトグルと呼ぶだけです。

27
00:01:34,190 --> 00:01:42,540
J. S.

28
00:01:42,540 --> 00:01:47,910
 

29
00:01:51,130 --> 00:01:57,450
私はいつも好きなのと同じディレクトリと内部にあります。私は彼らがOKに接続されていることを確認するために警告を追加し、そのスクリプトにリンクしてリンクする必要があります。そうですね。

30
00:01:57,510 --> 00:02:02,880
さあ、このファイルをブラウザで開き、私たちが得たものを見てみましょう。

31
00:02:02,880 --> 00:02:04,640
最初にここで指摘しておきます。

32
00:02:04,800 --> 00:02:10,770
物事は結ばれているが、ボタンはまだページ上にないという警告を受けていることに注意してください。

33
00:02:11,220 --> 00:02:14,710
だから私は警告を取り除くまで実際にボタンを見ない。

34
00:02:15,030 --> 00:02:17,450
そしてそれは本当に重要なことです。私たちはそれを修正したいと思います。

35
00:02:17,490 --> 00:02:24,210
これは、ボタンがページ上にある前に、ここのコードが最初に実行されていることを示しています。このコードは、ボタンがページ上にあるという事実に依存しています。

36
00:02:25,140 --> 00:02:30,060
 

37
00:02:30,150 --> 00:02:36,810
クイックリスナーを追加することはできません。それ以外の場合、イベントリスナーは動作し、実行中のページにあるアイテムにイベントを追加するだけです。

38
00:02:36,810 --> 00:02:39,100
 

39
00:02:39,450 --> 00:02:41,290
だから我々はこれを修正するいくつかの方法があります。

40
00:02:41,310 --> 00:02:47,040
今のところ最も簡単なのは、スクリプトをボディの最後まで移動させて、このボタンがロードされたことを確認することです。

41
00:02:47,040 --> 00:02:49,710
 

42
00:02:49,710 --> 00:02:55,020
ジェイクエリーになるとこれを行う別の方法について学習しますが、これは今のところ完全にうまくいきます。

43
00:02:55,020 --> 00:02:55,680
 

44
00:02:55,980 --> 00:02:59,440
ですから、今リフレッシュするとボタンがすでに表示されます。

45
00:02:59,610 --> 00:03:03,140
そしてそれを接続するという警告が表示されます。

46
00:03:03,210 --> 00:03:05,470
それでは論理について話しましょう。

47
00:03:05,490 --> 00:03:09,460
私たちのトグルJに行きましょう。 S. ボタンを選択します。

48
00:03:09,660 --> 00:03:19,920
だからvarボタンは、ドキュメントクエリのセレクタボタンと同じです、もちろん、それを選択するための単なる方法です。

49
00:03:20,970 --> 00:03:28,030
次に、イベントリスナーをクリックし、イベントリスナーのクリックを追加するボタンを追加し、次にコールバック関数を実行する関数を追加します。

50
00:03:30,930 --> 00:03:36,650
 

51
00:03:37,290 --> 00:03:44,100
そして、私はいつも正しいことを選択していることと、この機能が実行されていることを確認するためにクリックしたという警告を出して再開したい。

52
00:03:44,100 --> 00:03:46,450
 

53
00:03:46,470 --> 00:03:51,910
クリックすると更新されます。クリックしてクリックします。

54
00:03:51,960 --> 00:03:52,860
それは素晴らしいです。

55
00:03:52,860 --> 00:03:59,280
私たちがする必要があるのは、身体の背景色を変えることだけです。

56
00:03:59,700 --> 00:04:04,920
だから私はドキュメントダンプの本体をやってみて、それを紫色にしましょう。

57
00:04:05,100 --> 00:04:14,980
したがって、背景が紫色に等しいボディスタイルを文書化し、私はドキュメントドットボディを使用していることがわかります。

58
00:04:15,150 --> 00:04:24,830
 

59
00:04:24,840 --> 00:04:35,510
また、セレクタをクエリーし、bodyタグ名などのドキュメントをdikedタグ名のボディゼロで取得するドキュメントを作成することもできますが、ドキュメントドットボディを使用するほうがはるかに簡単です。

60
00:04:35,670 --> 00:04:38,730
これはドキュメントに組み込まれた単なるショートカットです。

61
00:04:38,730 --> 00:04:42,970
だから私はそれを紫色に変えて、私たちはここに行くのが良いはずです。

62
00:04:43,110 --> 00:04:50,770
私がクリックすると紫色の体ができますが、もちろんこの問題の一部は前後に切り替えられていました。

63
00:04:50,940 --> 00:04:56,310
だからここをクリックすると白に戻り、もう一度クリックして紫色に戻り、2つの間で切り替わります。

64
00:04:56,310 --> 00:04:57,870
 

65
00:04:58,290 --> 00:05:06,030
だから、私たちがやる必要があるのは、いくつかの論理を追加することです。そして、もしWhiteがそれに類似したものを作るのであれば、私たちのロジックはこのように見えるでしょう。

66
00:05:09,150 --> 00:05:16,040
 

67
00:05:16,350 --> 00:05:21,550
 

68
00:05:21,630 --> 00:05:29,130
だから、私はこれを処理するつもりですが、私はboolean値を作成するつもりです。紫色Savarは紫色です。ページをリフレッシュすると紫色になり、紫色はfalseになるので、falseとして開始します。

69
00:05:29,130 --> 00:05:29,930
 

70
00:05:29,970 --> 00:05:37,950
そして、私たちがする必要があるのは、私たちが紫色であるかどうかを調べるJavaScriptの内部です。

71
00:05:38,910 --> 00:05:45,450
だから紫色の場合は、このように背景色を白にしたいと思っています。

72
00:05:49,200 --> 00:05:50,370
 

73
00:05:50,520 --> 00:05:51,630
 

74
00:05:54,690 --> 00:06:02,020
そして変化は白でなければならないし、それ以外の場合は同じことをやりますが、それ以外は紫色にします。

75
00:06:02,040 --> 00:06:06,930
もちろん、唯一の問題は、今は紫色が常に偽であることです。

76
00:06:06,930 --> 00:06:08,610
私たちはそれを変えたいと思っています。

77
00:06:08,880 --> 00:06:16,230
 

78
00:06:16,230 --> 00:06:23,190
 

79
00:06:23,190 --> 00:06:27,610
だから紫色であれば体のスタイルは紫色ですが、背景は白色と同じですが、紫色と言えば、今度は白に変えてから偽と呼ばれ、紫色に変わったと言います紫色は真です。

80
00:06:27,840 --> 00:06:35,130
そして、これはブール値でなければなりません。

81
00:06:35,160 --> 00:06:38,280
だから私たちがここでやったことは、私たちの小さなターゲットトラッカーを作ることです。

82
00:06:38,280 --> 00:06:41,020
このブール値は、紫色の開始はfalseです。

83
00:06:41,070 --> 00:06:43,590
初めてそれは紫色です。

84
00:06:43,590 --> 00:06:44,510
それは起こりません。

85
00:06:44,610 --> 00:06:49,990
そこで、私たちは、背景を紫色に変えてから、紫色に変えて、もう一度行ってください。

86
00:06:50,190 --> 00:06:54,460
次回は、ユーザーがクリックすると紫色になります。

87
00:06:54,480 --> 00:06:58,890
したがって、背景を白に変更して紫色にすると、falseに設定され、前後に切り替えられます。

88
00:06:58,890 --> 00:06:59,930
 

89
00:06:59,970 --> 00:07:03,640
したがって、リフレッシュチェッカー評議会は、エラーがないことを確認します。

90
00:07:03,900 --> 00:07:08,910
そして、紫色の白と白をクリックしてみましょう。

91
00:07:09,450 --> 00:07:15,030
ですから、私たちが行うことができる小さな要因があります。これは、設定する必要はありません。これは、偽であることが偽であり、if文の中では紫色です。

92
00:07:15,090 --> 00:07:18,180
 

93
00:07:18,180 --> 00:07:21,110
私たちは書くだけでそれをやるより短い方法を持っています。

94
00:07:21,150 --> 00:07:25,360
パープルは紫色ではないですか？

95
00:07:25,770 --> 00:07:31,280
だからそれは真と偽の間でそれを切り替えるつもりです。そして偽と真はそれを否定します。

96
00:07:31,440 --> 00:07:33,660
それは素敵なショートカットです。

97
00:07:34,200 --> 00:07:40,080
 

98
00:07:40,080 --> 00:07:46,000
ここでは、それはHeiglだと分かりましたが、少し短くなっていますが、クラスリストについて学んだときに考えていた方がいらっしゃいました。

99
00:07:46,110 --> 00:07:48,230
トグルと呼ばれる方法がありました。

100
00:07:48,240 --> 00:07:55,320
だからCSAをクラスとして定義して、先に進んで私のスタイルの代わりにスタイルタグを作ってDotというクラスを追加してみましょう。

101
00:07:55,320 --> 00:08:01,590
 

102
00:08:01,590 --> 00:08:04,650
それを紫色または単に紫色と呼んでみましょう。

103
00:08:04,650 --> 00:08:12,630
これはクラス名ですが、背景は紫色で、私たちがやるべきことは、このクラスを体内でオンとオフに切り替えることだけです。

104
00:08:12,630 --> 00:08:16,680
 

105
00:08:16,680 --> 00:08:25,140
だからここに戻って、私は今コピーして数え上げるだけです。あなたがボタンをクリックすると、これをコメントしたり、これを取り除いたりするだけです。

106
00:08:25,140 --> 00:08:31,720
 

107
00:08:31,740 --> 00:08:37,820
私たちがやりたいことは、文書化することだけです。

108
00:08:38,230 --> 00:08:41,900
クラスレストグル。

109
00:08:42,210 --> 00:08:46,390
私たちが作ったクラスの名前は紫色でした。

110
00:08:46,470 --> 00:08:53,000
体が紫色のクラスを持っていなければ、それが追加されます。

111
00:08:53,400 --> 00:08:56,510
しかし、すでにクラス名が紫色かどうかをチェックします。

112
00:08:56,580 --> 00:08:57,660
それが削除されます。

113
00:08:57,660 --> 00:09:00,630
だから、紫色か白色かを追跡する必要はありません。

114
00:09:00,630 --> 00:09:05,850
現在、クラスが適用されている場合、またはクラスが適用されていない場合、これは不要です。これは、もう紫色のBoullionです。

115
00:09:06,270 --> 00:09:09,660
それは基本的にクラスレストグルの代わりにすべてがラップアップされています。

116
00:09:09,930 --> 00:09:11,390
だから私はリフレッシュします。

117
00:09:12,000 --> 00:09:15,980
クリックすると、同じように見えます。

118
00:09:16,110 --> 00:09:19,890
しかし、私たちが検査し、私たちは体を見る。

119
00:09:19,890 --> 00:09:20,670
さあ。

120
00:09:20,790 --> 00:09:22,930
通知クラスは紫色に等しい。

121
00:09:22,980 --> 00:09:26,310
それから私はクリックして、もう古典的な紫色はありません。

122
00:09:26,310 --> 00:09:27,570
それは遠ざかります。

123
00:09:27,990 --> 00:09:29,830
それは文書の上にあります。

124
00:09:29,910 --> 00:09:32,760
本当に本当に便利なクラスリストの切り替え。

125
00:09:32,760 --> 00:09:35,490
ここでは、このロジックよりもはるかに短いです。

126
00:09:35,490 --> 00:09:37,030
さて、それは私の解決です。