1
00:00:00,420 --> 00:00:01,690
既に歓迎されています。

2
00:00:01,980 --> 00:00:03,600
だから、私には非常に良いニュースがあります。

3
00:00:03,600 --> 00:00:08,130
やっとJavascriptを使ってHと組み合わせる時が来ました。 M. S. 評価する。

4
00:00:08,250 --> 00:00:10,160
これは私のお気に入りのユニットです。

5
00:00:10,170 --> 00:00:13,800
私の人生の教えを過ごしたことのすべてを教えるための私の好きな話題。

6
00:00:13,860 --> 00:00:16,180
それは本当にjavascriptが支払いを開始するところです。

7
00:00:16,200 --> 00:00:18,480
だから私たちはこの時点まで簡単なアプリケーションをいくつかやってきました。

8
00:00:18,540 --> 00:00:23,340
アラートやプロンプトを使って簡単にリストを作成することができます。それは非常にエキサイティングではないことは分かっていますが、Javascriptのパワーを実際に発揮しようとしているため、これはすべて変更する予定です。

9
00:00:23,340 --> 00:00:27,310
&nbsp;

10
00:00:27,510 --> 00:00:31,830
&nbsp;

11
00:00:31,830 --> 00:00:38,070
&nbsp;

12
00:00:38,070 --> 00:00:43,200
&nbsp;

13
00:00:43,200 --> 00:00:48,360
そして、このユニットはインタラクティブなゲームを作るようなものを作っていきます。本当のボタンやチェックボックス、そしてその背後にあるJavaScriptとアニメーション、そして本当に面白いエキサイティングなもので実際のフォームを使って実際にリストを作るつもりですちょっとしたコマンドラインや小さなjavascriptコンソールアプリではなく、あなたが共有できる何かを作ったような気がします。

14
00:00:48,840 --> 00:00:55,410
ですから、私たちがこれをすべて行う方法は、DOMと呼ばれる技術によるものです。

15
00:00:55,530 --> 00:01:00,210
だから、このレッスンはDOMの紹介として、次のいくつかのビデオでいくつか話をするつもりです。

16
00:01:00,210 --> 00:01:01,090
&nbsp;

17
00:01:01,140 --> 00:01:05,450
私は、DOMが何を表しているのかを定義することから始めたいと思います。

18
00:01:05,460 --> 00:01:08,300
なぜこれがエキサイティングなのかをよく理解して欲しい。

19
00:01:08,310 --> 00:01:12,180
&nbsp;

20
00:01:12,180 --> 00:01:17,000
他の人がこの資料を使用して構築したクールなアプリケーションを紹介し、選択してワークフローを操作する方法について説明します。

21
00:01:17,250 --> 00:01:19,230
だから始めましょう。

22
00:01:19,230 --> 00:01:20,910
それで、なぜあなたはこのすべてを気にするべきですか？

23
00:01:21,000 --> 00:01:22,550
まあ、それほど多くの理由があります。

24
00:01:22,680 --> 00:01:29,550
Gmail彼らはすべてJavaScriptのトンを使用しており、そのJavaScriptの大部分は各チームとSSと相互作用している犬とやり取りしています。ゲームのようなもの。

25
00:01:29,790 --> 00:01:35,610
実質的にすべての大きなウェブアプリがTwitterやFacebookのようなものInstagram

26
00:01:35,610 --> 00:01:40,890
YouTube

27
00:01:41,130 --> 00:01:46,740
我々は、私たちがプラットフォームをマリオのようなゲームにすることができるチックタックのつま先を作ることができる、我々は検証のフォームをドロップダウンメニューのようなより実用的なことを行うために使用することができます。

28
00:01:46,740 --> 00:01:50,780
&nbsp;

29
00:01:50,980 --> 00:01:52,760
ウェブページをインタラクティブにする方法

30
00:01:52,770 --> 00:01:54,470
アニメーションを追加する方法。

31
00:01:54,600 --> 00:01:59,520
&nbsp;

32
00:01:59,520 --> 00:02:04,710
ここで最後の1つは実際にはかなり素晴らしいサイトですが、ここ数年の間には、私が前に述べたように多くのjavascriptを使ってDomを操作しましたが、定義を開始する前にいくつか例を示しますこれらの用語は、DOMがどのように機能するかについて話します。

33
00:02:04,710 --> 00:02:09,270
&nbsp;

34
00:02:09,270 --> 00:02:10,040
&nbsp;

35
00:02:10,080 --> 00:02:11,870
私はあなたにいくつかのウェブサイトを見せたいと思います。

36
00:02:12,540 --> 00:02:17,370
だから最初のものはちょうどGoogleと私はあなたがこれに注意を払うか分からないが、あなたがHaloのようなGoogleで何かを検索し始めるとき。

37
00:02:17,370 --> 00:02:20,910
&nbsp;

38
00:02:21,000 --> 00:02:27,060
&nbsp;

39
00:02:27,060 --> 00:02:33,000
&nbsp;

40
00:02:33,000 --> 00:02:34,020
どのように私はこれがすべてのティモのように見えるこの事を得ることに注意してくださいこれは何かのdivや何かがヒットして表示され、私は私が新しい結果を得るかわいい子猫を入力するようなものを入力するように変化している。

41
00:02:34,020 --> 00:02:38,190
それはすべてjavascriptで行われましたが、これはいくつかのビデオの後にできることです。

42
00:02:38,190 --> 00:02:39,080
&nbsp;

43
00:02:39,120 --> 00:02:43,140
もちろん、Googleが持っているバックエンドを書くことはできませんが、ここでフロントエンドのことをすることができます。

44
00:02:43,140 --> 00:02:43,770
&nbsp;

45
00:02:43,770 --> 00:02:49,090
HMOのすべての成功はあなたが見るこれらのすべての効果は容易に複製することができます。

46
00:02:49,110 --> 00:02:54,000
&nbsp;

47
00:02:54,380 --> 00:02:59,280
&nbsp;

48
00:02:59,280 --> 00:03:01,000
それで、私が強調したい次のものはTomiのウェブサイトにあります。このBroughのコースボタンがあります。クリックすると右から順にプッシュするメニューが表示されます。

49
00:03:01,290 --> 00:03:06,400
そして、あなたが見ることができるカテゴリ上のホバーとして、私はポップアップするこのサブメニューを取得します。

50
00:03:06,660 --> 00:03:11,140
だから、それらはすべてjavascriptのものがページに追加されていて、要素を老化させました。

51
00:03:11,140 --> 00:03:13,230
これらはおそらくリスト項目とアンカータグです。

52
00:03:13,350 --> 00:03:17,970
それらは隠されているページに追加されていて、私は物事を多くのインタラクティブ機能にスクロールすると色で表示されます。

53
00:03:18,420 --> 00:03:19,790
&nbsp;

54
00:03:19,830 --> 00:03:22,430
だから私が見たい次のものは私のお気に入りの一つです。

55
00:03:22,650 --> 00:03:24,560
これはパッド攻撃と呼ばれるWebサイトです。

56
00:03:24,780 --> 00:03:26,030
だからこれは少し違います。

57
00:03:26,100 --> 00:03:31,410
実際にあなたが使用するウェブアプリケーションではありませんが、それは本当に楽しいおもちゃであり、Hで何ができるのかを示す素晴らしいデモです。

58
00:03:31,410 --> 00:03:33,210
T. マウス。

59
00:03:33,250 --> 00:03:37,940
SSのjavascriptので、私は強くお勧めし、あなた自身でこれを試してみることをお勧めします。

60
00:03:38,080 --> 00:03:45,660
Patta

61
00:03:45,660 --> 00:03:48,810
tapドットコムと私がしなければならないことは、私が押されたすべてのキーにキーボードの入力を開始することです。再生するサウンドと再生するクールなアニメーションに対応します。

62
00:03:48,900 --> 00:03:51,940
ですから、私に例を示しましょう。

63
00:03:52,080 --> 00:03:54,100
別のものがあります。

64
00:03:55,860 --> 00:03:57,040
だからどこかで迷子になることがあります。

65
00:04:03,510 --> 00:04:06,010
これは、私たちができることのようなものを要約しています。

66
00:04:06,120 --> 00:04:11,880
&nbsp;

67
00:04:11,890 --> 00:04:19,710
私はインタラクティブ性を持っているので、特定のキーを押したときだけコードが実行され、そのコードはサウンドとして再生されるだけでなく、視覚的に見えるものも変化します。

68
00:04:19,710 --> 00:04:23,970
だから、単にアラートを使用しているのではなく、CSSAで実際に表示される画面を変更しているだけではありません。

69
00:04:24,200 --> 00:04:26,280
&nbsp;

70
00:04:26,700 --> 00:04:31,110
だからうまくいけば、それらの例は、私たちが学ぶべきすばらしいものすべてについて少なくとも少しは興奮させました。

71
00:04:31,110 --> 00:04:31,790
&nbsp;
