Raja Tutor

Cara Menggunakan JavaScript pada HTML

Kode JavaScript disisipkan ke dalam halaman HTML dengan tag <script>.
Jadi semua kode JavaScript berada diantara tag <script> dan </script>.

Penempatan JavaScript pada bagian head atau body

JavaScript bisa ditempatkan dalam halaman HTML pada bagian head atau body atau keduanya

JavaScript pada bagian head

Berikut ini adalah contoh penempatan JavaScript pada bagian head dimana sebuah fungsi dipanggil saat tombol diklik.

<!DOCTYPE html>
<html>
   <head>
   <script>
      function myFunction() { 
         document.getElementById("bagian1").innerHTML = "Teksnya berubah.";
      }
   </script>
   </head>
   <body>
      <h1>Halaman Web</h1>
      <p id="bagian1">Sebuah Paragraf</p>
      <button type="button" onclick="myFunction()">Try it</button>
   </body>
</html>

JavaScript pada bagian body

Berikut ini adalah contoh penempatan JavaScript pada bagian body dimana sebuah fungsi dipanggil saat tombol diklik.


<!DOCTYPE html>
<html>
   <body>
      <h1>Halaman Web</h1>
      <p id="bagian1">Sebuah Paragraf</p>
      <button type="button" onclick="myFunction()">Try it</button>
      <script>
         function myFunction() { 
            document.getElementById("bagian1").innerHTML = "Teksnya berubah.";
         }
      </script>
   </body>
</html>

JavaScript Eksternal

Kode JavaScript bisa juga ditempatkan pada file eksternal. Penggunaan eksternal sangat praktis bila kode JavaScript digunakan pada banyak halaman HTML. File JavaScript eksternal disimpan dengan ekstensi .js. Untuk menggunakan JavaScript eksternal, sebuah referensi harus dibuat yaitu dengan menempatkan nama file JavaScript pada bagian atribute src (source) dari tag <script>

Bagian referensi ini bisa ditempatkan pada bagian head atau body dari halaman HTML dan akan berfungsi layaknya kode JavaScript yang ditulis lokal.

Perlu diketahui bahwa pada file JavaScript eksternal tidak boleh mengandung tag <script>.

Event dan Fungsi JavaScript

Sebuah fungsi (function) pada JavaScript adalah sebuah blok kode yang bisa dipanggil.
Sebagai contoh memanggil sebuah fungsi ketika sebuah event terjadi seperti ketika sebuah tombol/button diklik.