Peristiwa adalah tindakan atau kejadian yang terjadi dalam sistem. Dalam dunia pemrograman, peristiwa adalah sesuatu yang terjadi pada elemen HTML. Tapi ketika digunakan di halaman HTML, ia dapat bereaksi terhadap peristiwa ini. Pada artikel ini, kita akan melihat apa saja jenis kejadian di JavaScript dan bagaimana cara kerjanya, dalam urutan berikut:
Apa Peristiwa di JavaScript?
Javascript memiliki peristiwa yang menyediakan antarmuka dinamis ke halaman web. Peristiwa ini terhubung ke elemen di Model Objek Dokumen (PERTIMBANGAN).
Selain itu, peristiwa ini secara default menggunakan propagasi gelembung, yaitu, ke atas di DOM dari anak ke induk. Kami dapat mengikat acara baik sebagai sebaris atau dalam skrip eksternal. Dengan bantuan JavaScript, Anda dapat mendeteksi kapan peristiwa tertentu terjadi, dan menyebabkan sesuatu terjadi sebagai tanggapan atas peristiwa tersebut.
Jenis Peristiwa di JavaScript
Ada berbagai jenis acara di yang digunakan untuk bereaksi terhadap peristiwa. Disini kita akan membahas beberapa event yang terkenal atau paling sering digunakan seperti:
- Onclick
- Onkeyup
- Onmouseover
- Onload
- Sedang fokus
Jadi mari kita lanjutkan dan lihat peristiwa ini di JavaScript dengan contoh.
Acara Onclick
Peristiwa Onclick adalah peristiwa mouse dan memicu logika apa pun yang ditentukan jika pengguna mengklik elemen yang mengikatnya. Mari kita ambil contoh dan lihat cara kerjanya:
function edu () {alert ('Selamat datang di Edureka!')} Klik TombolKeluaran:
bagaimana mendeklarasikan array objek di java
Setelah Mengklik Tombol, Anda mendapatkan pesan peringatan berikut:
Acara Onekeyup
Acara ini adalah acara keyboard dan digunakan untuk menjalankan instruksi setiap kali tombol dilepaskan setelah ditekan. Contoh berikut menunjukkan cara kerja acara:
var a = 0 var b = 0 var c = 0 fungsi changeBackground () {var x = document.getElementById ('bg') bg.style.backgroundColor = 'rgb (' + a + ',' + b + ',' + c + ')' a + = 1 b + = a + 1 c + = b + 1 if (a> 255) a = a - b if (b> 255) b = a if (c> 255) c = b}Keluaran:
Setelah Anda menulis sesuatu, akan terlihat seperti ini:
Acara Onmouseover
Peristiwa onmouseover di JavaScript sesuai dengan mengarahkan penunjuk mouse ke atas elemen dan turunannya, yang terikat padanya. Contohnya ditunjukkan di bawah ini:
fungsi hov () {var e = document.getElementById ('hover') e.style.display = 'none'}Keluaran:
Kotak berwarna muncul sebelum mengarahkan mouse. Segera setelah Anda mengarahkan mouse ke atas kotak, kotak itu menghilang.
Onload Acara
Peristiwa onload muncul saat elemen dimuat sepenuhnya. Mari kita ambil contoh dan lihat cara kerjanya:
Keluaran:
Acara Onfocus
Event Onfocus memiliki daftar elemen yang menjalankan instruksi setiap kali menerima fokus. Contoh berikut menunjukkan cara kerja acara onfocus:
function terfokus () {var e = document.getElementById ('input') if (confirm ('Focus Event')) {e.blur ()}}Fokus di Kotak Input:
Keluaran:
Ini adalah beberapa peristiwa yang paling sering digunakan di JavaScript. Dengan ini, kami telah sampai pada akhir artikel kami. Saya harap Anda memahami apa itu peristiwa dan bagaimana penggunaannya.
Lihat kami yang dilengkapi dengan pelatihan langsung yang dipimpin instruktur dan pengalaman proyek kehidupan nyata. Pelatihan ini membuat Anda mahir dalam keterampilan untuk bekerja dengan teknologi web back-end dan front-end. Ini mencakup pelatihan tentang Pengembangan Web, jQuery, Angular, NodeJS, ExpressJS, dan MongoDB.
Ada pertanyaan untuk kami? Harap sebutkan di bagian komentar di blog ini dan kami akan menghubungi Anda kembali.