Didalam Katagori: Uncategorized, Javascript
dalam javascript dikenal istilah Event, atau suatu aturan yang menangani semua interaksi user dengan aplikasi, dalam hal ini website.salah satu event yang sering digunakan adalah onload().
silahkan lihat contoh pada script berikut:
<html>
<head>
<title>DOM</title>
</head>
<body>
<div id="text">Hello World!</div>
<script type="text/javascript">
window.onload = function(){
alert(document.getElementById(’text’).innerHTML);
}
</script>
</body>
</html>
script diatas akan menghasilkan prompt alert "Hello World"
sekarang kembali ke judul artikel ini, kita akan mengetahui dimana letak perbedaan antara menggunakan event window.onload() dengan yang tidak menggunakannya. perhatikan contoh dibawah yang tidak menggunakan event onload():
<html>Ternyata hasilnya tetap sama, dengan script sebelumnya (yang menggunakan event window.onload()), nah lalu dimana letak perbedaannya??
<head>
<title>DOM</title>
</head>
<body>
<div id="text">Hello World!</div>
<script type="text/javascript">
alert(document.getElementById(’text’).innerHTML);
</script>
</body>
</html>
Oke sekarang perhatikan contoh selanjutnya:
<html>pada script diatas, posisi tag div saya pindahkan dibawah tag script, dan perhatikan bahwa script tersebut tanpa menggunakan event window.onload();, lihat bagaimana hasilnya??
<head>
<title>DOM</title>
</head>
<body>
<script type="text/javascript">
alert(document.getElementById(’text’).innerHTML);
</script>
<div id="text">Hello World!</div>
</body>
</html>
YA! benar, hasilnya adalah error
document.getElementById("text") is nulltag dengan ID text tidak terdeteksi oleh script tersebut, itu dikarenakan letaknya tidak urut, karena secara default javascript akan diproses oleh browser dari atas ke bawah, Nah gimana??

Untuk memperjelas perbedaannya (nya => judul ) , perhatikan (atau kalo gak males dicoba

<html>
<head>
<title>DOM</title>
</head>
<body>
<script type="text/javascript">
window.onload = function(){
alert(document.getElementById(’text’).innerHTML);
}
</script>
<div id="text">Hello World!</div>
</body>
</html>
script diatas saya tambahi event window.onload(). lihat hasilnya!!
kesimpulan :
- penggunaan window.onload() lebih aman
- bila tidak ingin menggunakan window.onload(), maka perhatikan urutan javascript DOM dan HTML TAG (Object) mana yang lebih dulu menjadi acuan/ program dibaca dari atas ke bawah
- bila menggunakan window.onload(), maka urutan script antara javascript DOM dan HTML TAG (Object) boleh diabaikan
Tidak ada komentar:
Posting Komentar