1
00:00:00,000 --> 00:00:00,380

2
00:00:00,380 --> 00:00:03,000
>> SPEAKER 1: Sekarang dalam contoh terakhir,
ingat bahwa kita diselingi beberapa

3
00:00:03,000 --> 00:00:07,170
Kode JavaScript dalam HTML saya,
khusus, dalam nilai

4
00:00:07,170 --> 00:00:10,460
atribut disebut On Kirim
untuk itu tag form.

5
00:00:10,460 --> 00:00:12,850
Sekarang untuk halaman kecil, ini
bukan masalah besar.

6
00:00:12,850 --> 00:00:15,950
Tapi sebagai halaman web akan lebih lama dan lebih
kompleks, hanya menempatkan Anda

7
00:00:15,950 --> 00:00:19,660
Kode JavaScript di sana-sini dalam
dari nilai atribut tidak

8
00:00:19,660 --> 00:00:20,830
desain terbaik.

9
00:00:20,830 --> 00:00:23,440
Terbaik jika kita faktor yang keluar dan
setidaknya memasukkannya ke dalam

10
00:00:23,440 --> 00:00:25,200
tag script terpusat.

11
00:00:25,200 --> 00:00:26,080
>> Bagaimana melakukan ini?

12
00:00:26,080 --> 00:00:30,040
Nah mari kita kembali ke tag form dan
pertama menghapus atribut ini dan yang

13
00:00:30,040 --> 00:00:31,780
nilai sama sekali.

14
00:00:31,780 --> 00:00:35,730
Kemudian di sini, daripada mendefinisikan
fungsi yang disebut Greet, mari kita tunggu

15
00:00:35,730 --> 00:00:39,405
ke baris kode yang pada akhirnya kita
akan masih ingin mengeksekusi dan mengganti

16
00:00:39,405 --> 00:00:41,560
fungsi Greet sebagai berikut.

17
00:00:41,560 --> 00:00:48,190
Document.get Element By ID
mengutip demo tanda kutip -

18
00:00:48,190 --> 00:00:52,410
di mana demo, ingat, adalah unik
pengidentifikasi untuk form itu sendiri -

19
00:00:52,410 --> 00:00:56,600
dot di submit, yang ingat adalah nama
dari event handler yang

20
00:00:56,600 --> 00:00:57,710
kami tertarik.

21
00:00:57,710 --> 00:01:01,990
Dan mari kita menetapkan bahwa di submit handler
nilai yang sebenarnya

22
00:01:01,990 --> 00:01:03,740
fungsi itu sendiri.

23
00:01:03,740 --> 00:01:06,390
>> Sekarang perhatikan bahwa aku tidak benar-benar
memanggil fungsi di sini.

24
00:01:06,390 --> 00:01:10,650
Aku bukannya mendefinisikan anonim,
atau dikenal sebagai fungsi lambda,

25
00:01:10,650 --> 00:01:14,100
dengan menentukan antara kurung kurawal
sekelompok kode yang harus

26
00:01:14,100 --> 00:01:15,490
sebenarnya akan dieksekusi.

27
00:01:15,490 --> 00:01:18,500
Secara khusus, kode yang saya ingin
untuk mengeksekusi adalah bahwa garis yang saya miliki

28
00:01:18,500 --> 00:01:23,370
sebelumnya, dan kemudian mari kita tambahkan dengan
return false sehingga formulir ini tidak

29
00:01:23,370 --> 00:01:26,950
akhirnya diserahkan untuk mengakhiri web jarak jauh
Server dengan cara tradisional.

30
00:01:26,950 --> 00:01:30,345
>> Sekarang mari kita menyimpan file ini, membukanya
dalam browser, dan lihat apa yang terjadi.

31
00:01:30,345 --> 00:01:33,050

32
00:01:33,050 --> 00:01:39,800
http://localhost/dom-1.html.

33
00:01:39,800 --> 00:01:43,060
Sekarang mari kita mengetik nama saya,
David, Submit.

34
00:01:43,060 --> 00:01:46,900
Dan tidak ada yang tampaknya telah terjadi
kecuali URL halaman saya tampaknya

35
00:01:46,900 --> 00:01:52,580
telah berubah seolah-olah bentuk itu
benar-benar disampaikan ke file yang sama.

36
00:01:52,580 --> 00:01:53,870
>> Sekarang mengapa mungkin itu?

37
00:01:53,870 --> 00:01:55,340
Yah aku butuh informasi lebih lanjut.

38
00:01:55,340 --> 00:01:58,700
Jadi mari kita pergi ke depan dan membuka Chrome
Developer Tools sehingga saya benar-benar dapat

39
00:01:58,700 --> 00:02:01,440
melihat jendela konsol untuk melihat
jika saya telah melakukan sesuatu yang salah.

40
00:02:01,440 --> 00:02:03,330
Saya dapat mengakses melalui
beberapa cara.

41
00:02:03,330 --> 00:02:07,250
Salah satunya adalah melalui menu ini di sini,
kemudian di bawah Tools, kemudian turun ke

42
00:02:07,250 --> 00:02:08,509
Developer Tools.

43
00:02:08,509 --> 00:02:12,890
>> Dan perhatikan di sini di tab Console,
ada jenis kesalahan tidak tertangkap, tidak bisa

44
00:02:12,890 --> 00:02:15,390
mengeset properti di submit dari nol.

45
00:02:15,390 --> 00:02:16,900
Sekarang mengapa mungkin itu?

46
00:02:16,900 --> 00:02:21,380
Nah kembali dalam kode sumber saya di sini, pemberitahuan
bahwa pada tanggal menyerahkan saya pikir adalah

47
00:02:21,380 --> 00:02:25,360
properti dari elemen yang
identifier unik adalah demo.

48
00:02:25,360 --> 00:02:27,810
Sebuah elemen, sekali lagi, hanya
node di pohon.

49
00:02:27,810 --> 00:02:30,870
>> Jadi tampak bahwa browser saya tidak
berpikir bahwa elemen yang

50
00:02:30,870 --> 00:02:32,500
atau simpul ada belum.

51
00:02:32,500 --> 00:02:33,790
Dan memang, tidak.

52
00:02:33,790 --> 00:02:37,690
Ingat bahwa halaman web parsing atau membaca
oleh browser web, atas ke bawah,

53
00:02:37,690 --> 00:02:38,430
kiri ke kanan.

54
00:02:38,430 --> 00:02:41,810
Dan ketika kode JavaScript adalah
ditemui, biasanya, ini dijalankan

55
00:02:41,810 --> 00:02:42,700
segera.

56
00:02:42,700 --> 00:02:46,460
>> Tapi dalam kasus ini, kita bahkan belum mendapatkan
belum bagian dari dom tersebut,

57
00:02:46,460 --> 00:02:51,100
HTML, di mana bahwa bentuk dengan unik
identifier demo telah dinyatakan.

58
00:02:51,100 --> 00:02:54,320
Dan jadi kita mencoba untuk mengeksekusi saya
JavaScript kode sebelum node yang bahkan

59
00:02:54,320 --> 00:02:58,530
ada di pohon yang, tentu saja, adalah
bermasalah karena dengan begitu, pasti,

60
00:02:58,530 --> 00:03:01,390
unsur itu sendiri akan null
pada titik waktu.

61
00:03:01,390 --> 00:03:02,390
>> Jadi bagaimana memperbaikinya?

62
00:03:02,390 --> 00:03:03,810
Yah kita memiliki beberapa solusi.

63
00:03:03,810 --> 00:03:07,200
Tapi mari kita coba sederhana dengan relokasi
tag script saya dari kepala

64
00:03:07,200 --> 00:03:11,560
tag ke tubuh saya, namun secara khusus, terhadap
bagian bawah tubuh halaman saya jadi

65
00:03:11,560 --> 00:03:14,170
bahwa itu di bawah node
dan pertanyaan.

66
00:03:14,170 --> 00:03:19,930
Secara khusus, mari kita sorot dan memotong
tag terbuka dan tag tutup untuk skrip

67
00:03:19,930 --> 00:03:24,720
dan merelokasi bahwa seluruh blok kode
ke bagian bawah file di sini.

68
00:03:24,720 --> 00:03:27,690
>> Sekarang ini belum tentu terbersih
desain, tapi setidaknya itu akan

69
00:03:27,690 --> 00:03:29,530
menegakkan urutan yang benar dari operasi.

70
00:03:29,530 --> 00:03:31,495
Mari kita menyimpan file dan
ulang di browser saya.

71
00:03:31,495 --> 00:03:34,620

72
00:03:34,620 --> 00:03:40,240
Mari kita kembali halaman tersebut, kembali masukan nama saya,
dan di sana, Hello David kembali.

73
00:03:40,240 --> 00:03:42,784