Pada kesempatan kali ini saya akan membahas pengertian untuk memahami fungsi ready() jQuery . Segala sesuatu yang ada di dalamnya akan memuat setelah DOM dimuat dan sebelum isi halaman website dimuat.
JavaScript digunakan untuk memanipulasi objek HTML seperti tombol, paragraf, gambar, form, dll. Pada Event ready() tersebut memberikan simulasi efek dari event Onload JavaScript.
Untuk penulisan fungsi tersebut, seperti contoh di bawah ini:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<html> <head> <meta charset="UTF-8"> <title>Saya Sedang Belajar jQuery di Dumet School</title> <script src="https://code.jquery.com/jquery-2.2.0.js"></script> <script> $(document).ready(function() { // Ini untuk kode jQuery dan JavaScript nya }); </script> </head> <body> </body> </html> |
Seperti yang terlihat dari kode di atas, kode JavaScript yang berada di dalam nya akan dijalankan setelah seluruh tag HTML diproses oleh web browser.
Di sini saya akan membuat contoh kode program yang sangat sederhana, dimana pada saat tombol di klik, akan tampil kalimat di bawah tombol yang berisikan ( saya sedang belajar jquery di Dumet School ). Buatlah file html baru dengan nama terserah teman-teman, pada contoh di sini saya membuat file tersebut dengan nama index.html, dan ketikan seperti kode di bawah ini:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<html> <head> <meta charset="UTF-8"> <title>Saya Sedang Belajar jQuery di Dumet School</title> <script src="https://code.jquery.com/jquery-2.2.0.js"></script> <script> $(document).ready(function() { $("#pesan").click(function() { $(this).after('<p>Saya Sedang Belajar jQuery di Dumet School</p>'); }); }); </script> </head> <body> <button id="pesan">Klik Di Sini</button> </body> </html> |
Berikut penjelasan dari kode JavaScript tersebut:
1 |
$("#pesan").click(function() |
kode di atas adalah untuk memberikan event klik pada tombol yang memiliki ID pesan
1 |
$(this).after('<p>Saya Sedang Belajar jQuery di Dumet School</p>'); |
kode di atas adalah untuk menampilkan paragraf yang berisi text setelah event klik berjalan atau di jalankan.
Demikian pembahasan pengertian event ready() jquery, Semoga Membantu.
Terima Kasih.