Meletakkan JavaScript dalam file HTML
Anda akan membutuhkan
HTML dalam penulisan kode Javascript pada halaman web. Berikut ini
adalah HTML minimal yang Anda butuhkan untuk mengeksekusi kode
JavaScript kita. File HTML akan selalu berekstensi .html, Anda dapat
membuat file index.html seperti contoh di bawah ini.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title></title>
<script>
alert("Hello World!");
</script>
</head>
<body>
</body>
</html>
|
Ada cara lain yang lebih baik dalam meletakkan kode JavaScript, yaitu sebelum menutup body tag. Seperti ini.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<script>
alert("Hello World!");
</script>
</body>
</html>
|
Penulisan JavaScript
Kode
JavaScript selalu menempel pada HTML dalam penggunaannya sebagai skrip
pada web page. Untuk menggunakannya biasanya ditaruh dalam script tag.
Ada dua cara penulisan JavaScript, pertama adalah menulisnya di dalam
tag seperti contoh sebelumnya. Namun menulis seperti itu akan tercampur
menjadi satu dengan tag HTML atau stylesheet lainnya, serta jika kode
tersebut dibutuhkan di beberapa halaman web, maka akan menjadi pekerjaan
yang berulang-ulang.
Cara kedua, yaitu dengan memasukkan
JavaScript pada suatu file dengan ekstensi .js, contohnya pada skrip.js
yang diisi dengan hanya kode JavaScript tanpa script tag dan menambahkan
parameter src pada script tag. Jangan lupa untuk selalu menutup tagnya.
Berikut ini contoh index.html.
1
2
3
4
5
6
7
8
9
10
11
12
|
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<script src="skrip.js"></script>
</body>
</html>
|
Dan ini contoh skrip.js.
Dengan
memakai cara kedua akan memudahkan kita dalam menulis dan melakukan
perubahan pada kode JavaScript kita. Hal ini juga memudahkan jika Anda
memiliki banyak script, seperti framework dan plugin-pluginnya. Jika
kode JavaScript Anda banyak dan besar ukurannya juga dengan mudah dapat
di-minify supaya lebih cepat proses loading halaman webnya.
Sekian
perkenalan dari saya. Saya harap dengan membaca ini, Anda sudah bisa
memulai untuk belajar JavaScript. Nantikan post saya selanjutnya
mengenai variable pada JavaScript. Anda dapat subscribe ke
RSS atau ke email list untuk mendapatkan update tutorial selanjutnya. Jangan lupa tinggalkan komentar bila ada pertanyaan ataupun saran.
Sumber: Tuts+ Premium Course: JavaScript Fundamentals 101 oleh Jeremy McPeak
