Pengertian javascript secara luas bisa dilihat di sini atau di sini. Namun secara umum javascript adalah bahasa pemrograman berbasis java yang banyak digunakan dalam pembuatan web. untuk penggunaan, kita bisa memasukkan script script javascript ke dalam dokumen HTML untuk membuat tampilan lebih modern hingga kebutuhan yang lebih khusus.
Berikut beberapa cara untuk memasukkan kode javascript ke dalam dokumen HTML:
- Penggunaan tag <script>
Cara ini termasuk cara memasukkan script secara intrnal (internal javascript). Internal yang dimaksud adalah script ditulis langsung dalam dokumen HTML jadi antara kode javascript dan HTML berada dalam satu file/halaman. Hal ini digunakan ketika kode javascript yang dibutuhkan hanya berhubungan dengan halaman tersebut dan tidak ada hubungannya dengan halaman lain. Biasanya script yang dimasukkan tidak terlalu panjang (sehingga untuk membuat halaman lain yang terpisah hanya untuk menuliskan script yang dimaksud hanya akan menambah banyak file saja.) walau tidak menutup kemungkinan script panjang pun ditulis satu halaman dengan kode HTMLnya
Untuk penulisan script dengan cara ini, kode javascript yang akan dimasukkan diletakkan diantara <script> dan </script>. (<script> disebut tag pembuka dan </script> disebut tag penutup). Sebagai contoh:Ini adalah isi dari index.html (bisa juga disimpan dengan nama lain)Secara umum tag <script> adalah cara untuk memberitahu web browser bahwa kode-kode diantara tag pembuka dan penutup (<script> ... </script>) tidak termasuk kode HTML melainkan termasuk script. Jadi secara teori jika tag <script> ditulis di dalam tag <body> maka script tetap akan terbaca karena meski dalam satu halaman yang sama antara HTML dan javascript sendiri itu terpisah.<html><head><title>belajar javascrpt cara MKD</title><script>alert("Mari, Mengenal Komputer Dasar");</script></head><body><center><h1>Belajar JavaScript cara MKD</h1></center>Selamat belajar.</body></html>
tapi itu hanya teori dari saya. Untuk membuktikannya silahkan coba sendiri. (otak aka lebih menerima apa yang ditemukan sendiri dari pada teori dari orang lain) ^_^ .
Oh iya dalam beberapa penulisan kadang orang menuliskan script javascript seperti ini
<script type="text/javascript">
//kode javascript diletakkan disini</script>
atribut type="text/javascript" dimaksudkan untuk menegaskan bahwa script itu memang script javascript bukan script dari bahasa lain. Namun di jaman modern kebanyakan web browser telah memakai javascript sebagai bahasa defaultnya jadi atribute type sudah jarang dipakai. - Penggunaan Event Handler
Cara ke-2 ini (inline javascript) masih sama seperti cara yang pertama yaitu script masih ditulis langsung di halaman HTML, perbedaannya adalah script akan aktif hanya ketika ada sebuah event misalnya ketika elemen tertentu di-klik atau disorot mouse.
Meski cara ini bisa dilakukan/dipakai namun secara umum hal ini tidak disarankan untuk digunakan karena cara ini menjadikan script content(HTML) dan behavior(javascript) jadi tercampur dan menjadi tidak fleksibel. Hal tersebut akan terrasa ketika kode javascript yang digunakan lumayan panjang.
sebagai contoh:<html><head><title>belajar javaScript cara MKD</title></head><body><h1>Belajar JavaScript cara MKD</h1><p>Untuk mengecek kerja anda silahkan.</p><button OnClick="alert('Selamat script berhasil dijalankan')">Klik di sini</body></html>
Event yang dimaksud di sini adalah tidakan seperti pada script di atas, yang dimaksud eventnya adalah atribut "OnClick" artinya script akan aktif ktika dilakukan klick pada button yang memiliki atribut OnClick tersebut. Hal ini tidak fleksibel karena javascript menjadi bagian yag tidak terpisahkan dari HTML. - Penggunaan URL
Cara ke-3 adalah dengan memanfaatkan atribut href (biasanya pada tag <a> ) sebagai pemanggil kode javascript. Ini adalah cara awal penggunaan javacript yang pada jaman sekarang sudah tidak umum dilakukan. Dikenal juga dengan nama protocol javascript karena konsepnya seperti saat kita membuat link/url dalam sebuah halan dengan alamat/url http:// digantikan dengan javascript.
contoh sederhana :<html><head><title>belajar javaScript cara MKD</title></head><body><center><h1>Belajar JavaScript cara MKD</h1></center><p>Coba klik</p><a href="javascript:alert('OK!! selamat anda berhasil')">ini</a>
<p> untuk mengecek apakah anda sudah berhasil</p></body></html>
Selain untk menampilkan/memasukkan kode javascript ke dalam halaman HTML cara ptocol javascript juga bisa digunakan tanpa menggabungkannya dengan kode HTML, misalnya dengan menulis script "javascript:alert('dataku atau apalah')" tanpa kutip di address bar browser, cara seperti ini sering disebut juga dengan nama bookmarklet. - Penggunaan tag <script src="...">
Cara ini termasuk eksternal javascript karena memisahkan kode javascript dalam file tersendiri yang kemudian dipanggil dengan penggunaan tag <script src="..."> . Cara yang sangat disarankan untuk digunakan karena membuat lebih efisien dan fleksibel dibanding dengan cara-cara sebelumnya.
Untuk penyimpanan file javascript yang terpisah tadi file javascript tersebut disimpan dengan ekstensi *.js misalnya saja coba.js maka alamat dari file coba.js lah yang diisikan dalam atribt src tadi.
sebagai contoh:
ini adalah index.html<html><head><title>belajar javaScript cara MKD</title>
<script src="js/coba.js"></script></head><body><center><h1>Belajar JavaScript cara MKD</h1></center><p>terimakasih</p></body></html>
dalam coba.js kita tuliskan script misalnya:
alert("Anda hebat!!")
Mengapa saya tuliskan js/coba.js ? itu karena saya meletakkan coba.js di dalam sebuah folder yang bernama "js" di mana folder js itu berada satu folder dengan index.html
untuk penulisan tag <script src="..."> selain menggunakan tag buka dan tag tutup bisa juga dengan menggunakan self closing tag maka akan mejadi seperti ini <script src="js/coba.js"/>. Hasil yang didapat akan sama saja jadi itu terserah mana cara yang lebih mudah menurut anda.
Dari keempat cara di atas cara ke-4 adalah cara paling umum dan paling disarankan dalam pemanggilan javascript pada suatu halaman karna selain fleksibelitas juga memberikan keuntungan lain, di antaranya adalah:
- Memisahkan kode-kode HTML dan js sehingga dalam dokumen HTML hanya ada kode-kode HTML begitupun dalam dokumen js. Hal ini juga akan sangat membantu saat harus terjadinya pengeditan script
- Jika diperlukan kode js yang sama dalam setiap halaman maka penulisan dokumen js cukup satu kali dan bisa dipanggil oleh semua halaman yang membutuhkan kode itu ini juga akan mempercepat loading pada web browser karena javascript file yang harus dibaca hanya satu.
Demikian sekilas tentang Cara pemasukkan kode js pada HTML, semoga bermanfaat.
//Koreksi diterima jika ada hal yang harus diperbaiki
