4 Teknik Penulisan Kode Program Javascript pada HTML

4 Teknik Penulisan Kode Program Javascript pada HTML

Halo Garuda Reader (GReader), pada artikel ini, GReader akan diajari teknik-teknik apa saja yang bisa digunakan untuk menulisan kode program Javascript. Oh ya, Javascript itu merupakan sebuah bahasa pemrograman yang berjalan di atas browser sehingga perlu di tulis pada HTML. Tujuan penulisan kode program javascipt ini adalah agar website yang dibuat bisa terlihat lebih interaktif. Untuk GReader yang belum tahu, berikut ini merupakan 4 teknik penulisan kode pemrograman javascript pada HTML yang dirakum dari situ petanikode.com.

  1. Tag <script>

Teknik ini ditulis dengan menuliskannya pada tag <script>, bisa ditulis di dalam tag <head> atau juga dalam tag<body>. Contohnya adalah :

<!DOCTYPE html>
<html>
<head>
    <meta charset=utf-8>
    <title>Penulisan Javascript</title>
    <script>
    console.log(Hi, ini kode Javascript);
    </script>
</head>
<body>

<script>
document.write(Javascript itu keren!);
</script>
</body>
</html>
  1. File Eksternal

Jika GReader tidak menginginkan kode-kode javascript GReader bercampur aduk dengan HTML, GReader dapat menuliskannya secara terpisah. Untuk menggunakan teknik ini, buatlah terlebih dahulu sebuah file berekstensi .js. Contohnya adalah :

// file-eksternal.js
alert(Kode Javascript dari File Eksternal);

Kemudian, gabungkan file yang berekstensi .js diatas dengan file HTML yang GReader miliki. Untuk menggabungkannya, gunakanlah tag<script> dengan atribut src untuk menentukan lokasi dari file Javascript.

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title>Penulisan Javascript</title>

<script src=file-eksternal.js></script>


</head>
<body>

</body>
</html>
  1. Atribut Event

Teknik yang ketiga ini, termasuk teknik favorit yang sering digunakan untuk pemanggilan pada event-event tertentu. Sebagai contoh adalah saat sebuah elemen diklik, maka jalankan fungi Javascript. Contohnya dalah :

<button onclick=alert(&singlequote;Selamat Datang di Garuda Cyber Indonesia&singlequote;)>Klik donk!</button>

Jika pada script diatas, digunakan event onclick. Diantara event yang bisa digunakan adalah onsubmit, onclick, onmouseover, ondoubleclick, onmouseout, dan lain sebagainya.

  1. URL

Teknik terakhir yang dapat kamu gunakan adalah penulisan Javacript pada URL. Berbeda dengan teknik ketiga, teknik ini jarang digunakan. Meski Demikian, untuk menjadi programmer, GReader juga harus mengetahuinya. Penulisan in menggunakan protokol Javascript. Sebagai contoh, GReader dapat menuliskan kode seperti dibawah ini pada URL browser GReader ya.

javascript:alert(Selamat Datang di Garuda Cyber Indonesia)

Terus, coba GReader tekan enter pada keyboard GReader. Kira-kira hasilnya akan seperti di bawah ini.

Bagaimana caranya untuk menggunakan teknik ini pada HTML ?

Caranya mudah GReader. GReader bisa menggunakan tag<a>, kemudian pada atribut href, letakkan kode Javascript. Dengan cara ini, kamu bisa menggantikan penulisan untuk event onclick.

<a href=javascript:alert(&singlequote;Selamat Datang di Garuda Cyber Indonesia&singlequote;)>Klik Aku</a>

Demikianlah 4 Teknik Penulisan Kode Program Javascript pada HTML. So GReader, teknik mana nih yang sering GReader gunakan ?

Ditulis Oleh : Ahmad Lutfi

Sukai/Like Fan Page Facebook Garuda Cyber Indonesia

Subscribe Channel Youtube Garuda Cyber Indonesia

Follow Instagram Garuda Cyber Indonesia

Chat Wa

Artikel Terpopuler

Definisi Struktur Kontrol Perulangan Dalam Pemrograman Dan Contohnya

Pada dasarnya perulangan pada pemrograman yang sama dengan perulangan bahasa pemrograman lainnya. Struktur kontrol perulangan yang dipakai memilki suatu fungsi dari program yang akan dijalankan secara berulang. Contohnya anda ingin membuat tampilan nama anda sebanyak 100 kali, tentu akan sangat lama jika anda menuliskan kode program secara dengan manual. Dengan struktur kontrol perulangan bisa menampilkan dengan nama sebanyak 100 kali...