Panduan Lengkap JavaScript: Where To? (Tutorial JavaScript Part 2)

Logo JavaScript
Gambar 2.0 : JavaScript

JavaScript adalah bahasa pemrograman yang super powerful buat bikin website jadi interaktif dan dinamis. Tapi, di mana sih tempat terbaik buat naro JavaScript di dalam halaman HTML? Nah, di artikel ini, kita bakal kupas tuntas soal penempatan JavaScript yang benar!

1. Tag <script>

Tag <script> adalah cara standar buat nulis JavaScript di dalam HTML. Kamu bisa naro kode langsung di dalamnya atau manggil file eksternal.

Contoh kode langsung:

<script>
    alert("Halo, dunia!");
</script>

Hasilnya:

Memasang JavaScript di HTML
Gambar 2.1 : Contoh memasang JavaScript di HTML

Atau kalau pakai file eksternal:

<script src="script.js"></script>

2. JavaScript Functions dan Events

JavaScript sering dipakai buat menangani event kayak klik tombol, hover, dan lainnya. Contoh sederhana nih:

<button onclick="sayHello()">Klik Aku!</button>

<script>
    function sayHello() {
        alert("Halo, selamat datang!");
    }
</script>

Hasilnya:

Contoh sederhana JavaScript
Gambar 2.2 : Contoh sederhana JavaScript

3. JavaScript di <head> atau <body>?

Nah, ini pertanyaan yang sering bikin bingung. JavaScript bisa ditempatkan di dalam <head> atau <body>, tapi ada kelebihan dan kekurangannya sendiri.

4. JavaScript di <head>

Kalau naro JavaScript di <head>, browser bakal nge-load script sebelum halaman muncul. Cocok buat script yang nggak butuh elemen HTML buat jalan.

<head>
    <script>
        console.log("Ini dari head!");
    </script>
</head>

Tapi hati-hati! Kalau script-nya ngubah elemen HTML, bisa error karena elemen belum ada pas script dieksekusi.

5. JavaScript di <body>

Lebih disarankan naro JavaScript di bagian bawah <body> supaya HTML bisa dimuat dulu, baru script jalan. Contohnya:

<body>
    <h1>Halo!</h1>
    <script>
        console.log("Ini dari body!");
    </script>
</body>

6. External JavaScript

Biar kode lebih rapi dan gampang dikelola, biasanya JavaScript ditaruh di file terpisah dengan ekstensi .js. Contohnya:

File script.js:

console.log("Halo dari file eksternal!");

Dan di HTML:

<script src="script.js"></script>

7. Keuntungan Pakai External JavaScript

Kenapa harus pakai file eksternal? Ini dia alasannya:

  • Bikin kode lebih rapi – HTML dan JavaScript terpisah, jadi nggak berantakan.
  • Bisa dipakai ulang – Satu file JavaScript bisa dipakai di banyak halaman.
  • Load lebih cepat – Browser bisa nge-cache file eksternal, jadi nggak perlu download ulang setiap kali buka halaman.

8. External References

Kalau mau pakai library atau framework kayak jQuery atau React, biasanya kita pakai CDN (Content Delivery Network). Contoh cara panggil jQuery:

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

Kesimpulannya, tempat terbaik buat naro JavaScript tergantung kebutuhan. Kalau mau aman, taruh di bawah <body> atau pakai file eksternal biar lebih efisien. Selamat coding!

Posting Komentar untuk "Panduan Lengkap JavaScript: Where To? (Tutorial JavaScript Part 2) "