".JavaScript."
JavaScript adalah
bahasa skrip yang populer di internet dan dapat bekerja di sebagian besar
penjelajah web populer sepertiInternet Explorer (IE), Mozilla Firefox, Netscape
dan Opera. Kode JavaScript dapat disisipkan dalam halaman web menggunakan tag
SCRIPT. Jika dilihat dari suku katanya terdiri dari dua suku kata, yaitu Java
dan Script. Java adalah Bahasa pemrograman berorientasi objek, sedangkan Script
adalah serangkaian instruksi program.
Secara fungsional,
JavaScript digunakan untuk menyediakan akses script pada objek yang dibenamkan
( embedded ). Contoh sederhana dari penggunaan JavaScript adalah membuka
halaman pop up, fungsi validasi pada form sebelum data dikirimkan ke server,
merubah image kursor ketika melewati objek tertentu, dan lain lain.
JavaScript dapat
bereaksi terhadap events - JavaScript dapat di-set untuk menjalankan saat
terjadi sesuatu, seperti sebuah page telah selesai dipanggil atau saat seorang
user meng-klik pada HTML element. JavaScript dapat membaca dan menulis HTML
elements - JavaScript dapat membaca dan mengubah isi dari HTML element.
JavaScript dapat
digunakan untuk mem-validasi data - JavaScript dapat digunakan untuk
mem-validasi form data sebelum di-submitted ke server, hal ini akan mengamankan
server dari pemrosesan extra. JavaScript dapat digunakan untuk mendeteksi
browser pengunjung - JavaScript dapat digunakan untuk mendeteksi browser
pengunjung dan – memanggil page lain yang secara specifik didesain untuk
browser tersebut. JavaScript dapat digunakan untuk membuat cookies - JavaScript
dapat digunakan untuk menyimpan dan memanggil informasi di komputer
pengunjung.
Yang harus
diperhatikan dalam pengelolaan pemrograman JavaScript, diantaranya JavaScript
adalah “case sensitive”, yang artinya JavaScript membedakan huruf besar dan
huruf kecil. Jika Anda pernah belajar bahasa pemrograman seperti Turbo C atau
C++, maka sama seperti bahasa pemrograman tersebut, dimana huruf T tidak sama
dengan huruf t.
Dalam bahasa
pemrograman JavaScript juga, sebagai contoh fungsi perintah var tidak boleh ditulis
Var dan juga tidak boleh ditulis VAR (huruf besar semua), yang benar adalah var
(huruf kecil semua). Perintah lain adalah new Date tidak boleh ditulis new date
(huruf kecil semua), dsb.
Kelebihan JavaScript
JavaScript bekerja
pada sisi browser. maksudnya begini : untuk menampilkan halaman web, user
menuliskan alamat web di address bar url. setelah itu, browser “mengambil” file
html ( dengan file jJvaScript yang melekat padanya jika memang ada ) ke server
yang beralamat di URL yang diketikan oleh user. Selesai file diambil, file
ditampilkan pada browser. Nah, setelah file JavaScript berada pada browser,
barulah script JavaScript tersebut bekerja.
Efek dari Javascript
yang bekerja pada sisi browser ini, Javascript dapat merespon perintah user
dengan cepat, dan membuat halaman web menjadi lebih responsif. JavaScript
melakukan apa yang tidak bisa dilakukan oleh HTML, PHP, dan CSS : menangani hal
– hal yang membutuhkan respons cepat terhadap aksi dari user.
Contoh : fungsi
validasi pada form. ketika anda mengisi sebuah form yang divalidasi menggunakan
JavaScript, anda mengetikkan data lalu mengetik submit, sebelum data dikirimkan
ke server, data akan “dicek” terlebih dahulu pada browser menggunakan fungsi
JavaScript yang ada pada halaman web. sehingga, jika memang data yang anda
isikan tidak valid, daripada membuang – buang waktu dengan mengirimkan data ke
server baru di validasi di server dan lalu server mengirimkan respons balik
mengenai ketidak validan input data anda, lebih baik cek validasi data form dilakukan
secara lokal di browser menggunakan fungsi JavaScript.
Lebih Cepat dan Lebih
Hemat
Implementasi
terpopuler saat ini dari pemrograman JavaScript adalah teknik AJAX.
(Asynchronous JavaScript and XMLHTTP ). teknik ini sering digunakan oleh
aplikasi berbasis web seperti Gmail, Google Reader, dan lain lain. Teknik yang
membuat pertukaran data antara server dan browser terjadi di belakang layar
sehingga interaksi antara user dan aplikasi web semakin responsif. Post
tersendiri untuk membahas hal ini akan kita siapkan
Struktur Pada Halaman Web
Pada dasarnya sebuah
halaman web diatur seperti cara berikut ini:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html
xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>DHTML example</title>
<script type="text/javascript">
function init() {
myObj = document.getElementById("navigation");
// .... more code]]
}
window.onload=init;
</script>
</head>
<body>
<div
id="navigation"></div>
<pre>
Walaupun kode tersebut
disimpan pada file eksternal; ini bisa diselesaikan dengan membuat pranala file
yang mengandung JavaScript. Hal ini berguna jika menggunakan skrip pemrograman
yang sama pada beberapa [[halaman web]]:
</pre>
<script type="text/javascript"
src="myjavascript.js"></script>
</body>
</html>
Kode berikut
menggambarkan fungsi yang paling sering digunakan. Bagian tambahan pada sebuah
halaman web hanya akan ditampilkan jika pengguna menginginkannya.
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html
xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Test</title>
<style type="text/css">
h2 {background-color: lightblue; width: 100%}
a
{font-size: larger; background-color: goldenrod}
a:hover {background-color: gold}
#example1 {display: none; margin: 3%; padding: 4%; background-color: limegreen}
</style>
<script type="text/javascript">
function changeDisplayState (id) {
d=document.getElementById("tampilkansembunyikan");
e=document.getElementById(id);
if (e.style.display == 'none' || e.style.display == "") {
e.style.display = 'block';
d.innerHTML = 'Sembunyikan contoh..............';
} else {
e.style.display = 'none';
d.innerHTML = 'Tampilkan contoh';
}
}
</script>
</head>
<body>
<h2>Cara menggunakan fungsi DOM</h2>
<div><a id="tampilkansembunyikan"
href="javascript:changeDisplayState('contoh1')">Tampilkan
contoh</a></div>
<div
id="contoh1">
Ini adalah sebuah contoh.
(Informasi tambahan, hanya ditampilkan jika diinginkan pengguna)...
</div>
<div>Lanjutan teks...</div>
</body>
</html>
Penulisan JAVASCRIPT
Kode JavaScript
biasanya dituliskan dalam bentuk fungsi yang ditaruh di tag <head> yang
dibuka dengan tag
<script
type="teks/javascript">
.
<script
type="teks/javascript">
alert("Halo Dunia!");
<script>
Kode JavaScript juga
bisa diletakkan di file tersendiri yang berekstensi .js (singkatan dari
JavaScript). Untuk memanggil kode JavaScript yang terdapat di file sendiri, di
bagian awal <head> harus ditentukan dahulu nama file .js yang dimaksud
menggunakan contoh kode seperti berikut:[7]
<script
type="teks/javascript" src="alamat.js">
</script>
Script pada bagian head
Script ini akan
dieksekusi ketika dipanggil (biasanya berbentuk function) atau dipanggil
berdasarkan trigger pada event tertentu. Peletakkan script di head akan
menjamin skript di-load terlebih dahulu sebelum digunakan (dipanggil).
<html>
<head>
<script
type="teks/javascript">
...
</script>
</head>
</html>
Script pada Body
Script ini dieksekusi
ketika halaman di-load sampai di bagian <body>. Ketika menempatkan script
pada bagian <body> berarti antara isi dan JavaScript dijadikan satu
bagian.
<html>
<head>
</head>
<body>
<script
type="teks/javascript">
...
</script>
</body>
</html>
Jumlah JavaScript di
<head> dan <body> yang ditempatkan pada dokumen tidak terbatas.
External JavaScript
Terkadang ada yang
menginginkan menjalankan JavaScript yang sama dalam beberapa kali pada halaman
yang berbeda, tetapi tidak mau disibukkan jika harus menulis ulang script yang
diinginkan di setiap halaman. Maka JavaScript dapat ditulis di file secara
eksternal. Jadi, antara dokumen HTML dan JavaScript dipisahkan, kemudian berkas
tersebut dipanggil dari dokument HTML. Berkas JavaScript tersebut disimpan
dengan ekstensi .js.
JavaScript : js/xxx.js
document.write("pesan
ini tampil ketika halaman diload");
Untuk menggunakan
eksternal JavaScript (.js) dipakai atribut "src" pada tag
<script> pada halaman HTML-nya.
<html>
<head>
</head>
<body>
<script
src="xxx.js">
</script>
<p>Script di
atas berada di berkas "xx.js" (eksternal) </p>
</body>
</html>
Elemen dasar JavaScript
Sebagaimana
bahasa pemrograman umumnya, JavaScript terbentuk
atas elemen-elemen fundamental. Di sini kita tidak akan mengulas
elemen-elemen tersebut, melainkan langsung membahas
beberapa komponen dasar yang kerap digunakan saat
bekerja dengan JavaScript