tutorial pengembangan web terbaru
 

HTML DOM Acara


HTML DOM Acara

Peristiwa HTML DOM memungkinkan JavaScript untuk mendaftarkan event handler yang berbeda pada elemen dalam dokumen HTML.

Acara biasanya digunakan dalam kombinasi dengan fungsi, dan fungsi tidak akan dieksekusi sebelum peristiwa itu terjadi (such as when a user clicks a button) .

Tip: Model acara dibakukan oleh W3C di DOM Level 2.


HTML DOM Acara

DOM: Menunjukkan di mana DOM Level properti diperkenalkan.

mouse Acara

Peristiwa Deskripsi DOM
onclick Acara ini terjadi ketika pengguna mengklik elemen 2
oncontextmenu Acara ini terjadi ketika pengguna benar-klik pada elemen untuk membuka menu konteks 3
ondblclick Acara ini terjadi ketika pengguna double-klik pada elemen 2
onmousedown Acara ini terjadi ketika pengguna menekan tombol mouse elemen 2
onmouseenter Acara ini terjadi ketika pointer dipindahkan ke sebuah elemen 2
onmouseleave Acara ini terjadi ketika pointer dipindahkan dari unsur 2
onmousemove Acara ini terjadi ketika pointer bergerak sementara itu lebih merupakan elemen 2
onmouseover Acara ini terjadi ketika pointer dipindahkan ke sebuah elemen, atau ke salah satu anak yang 2
onmouseout Acara ini terjadi ketika pengguna menggerakkan pointer mouse keluar dari elemen, atau keluar dari salah satu anak-anaknya 2
onmouseup Acara ini terjadi ketika pengguna melepaskan tombol mouse elemen 2

Keyboard Acara

Peristiwa Deskripsi DOM
onkeydown Acara ini terjadi ketika pengguna menekan tombol 2
onkeypress Acara ini terjadi ketika pengguna menekan tombol 2
onkeyup Acara ini terjadi ketika user melepaskan tombol 2

Frame / Obyek Events

Peristiwa Deskripsi DOM
onabort Acara ini terjadi ketika pemuatan sumber daya telah dibatalkan 2
onbeforeunload Acara ini terjadi sebelum dokumen akan segera dibongkar 2
OnError Acara ini terjadi ketika terjadi kesalahan saat memuat file eksternal 2
onhashchange Acara ini terjadi ketika ada perubahan jangkar bagian dari URL 3
onload Acara ini terjadi ketika sebuah objek telah dimuat 2
onpageshow Acara ini terjadi ketika pengguna menavigasi ke halaman web 3
onpagehide Acara ini terjadi ketika pengguna menavigasi jauh dari halaman web 3
OnResize Acara ini terjadi ketika tampilan dokumen diubah ukurannya 2
onscroll Acara ini terjadi ketika scrollbar elemen ini sedang menggulir 2
onunload Acara ini terjadi setelah halaman telah dibongkar (untuk <body>) 2

Form Acara

Peristiwa Deskripsi DOM
onblur Acara ini terjadi ketika elemen kehilangan fokus 2
dalam perubahan Acara ini terjadi ketika isi dari elemen bentuk, seleksi, atau negara diperiksa telah berubah (for <input>, <keygen>, <select>, and <textarea>) 2
onfocus Acara ini terjadi ketika elemen mendapat fokus 2
onfocusin Acara ini terjadi ketika elemen adalah untuk mendapatkan fokus 2
onfocusout Acara ini terjadi ketika unsur adalah tentang kehilangan fokus 2
oninput Acara ini terjadi ketika elemen mendapat masukan pengguna 3
oninvalid Acara ini terjadi ketika elemen tidak valid 3
onreset Acara ini terjadi ketika formulir reset 2
onsearch Acara ini terjadi ketika pengguna menulis sesuatu di kolom pencarian (untuk <input = "search">) 3
onselect Acara ini terjadi setelah pengguna memilih beberapa teks (for <input> and <textarea>) 2
aktivitas pengiriman Acara ini terjadi ketika formulir dikirimkan 2

Drag Acara

Peristiwa Deskripsi DOM
ondrag Acara ini terjadi ketika elemen diseret 3
ondragend Acara ini terjadi ketika pengguna telah selesai menyeret elemen 3
ondragenter Acara ini terjadi ketika elemen diseret masuk target penurunan 3
ondragleave Acara ini terjadi ketika elemen diseret meninggalkan target penurunan 3
ondragover Acara ini terjadi ketika elemen diseret lebih target penurunan 3
ondragstart Acara ini terjadi ketika pengguna mulai menyeret elemen 3
ondrop Acara ini terjadi ketika elemen diseret dijatuhkan pada target penurunan 3

clipboard Acara

Peristiwa Deskripsi DOM
oncopy Acara ini terjadi ketika salinan pengguna isi elemen
oncut Acara ini terjadi ketika pengguna memotong isi dari sebuah elemen
onpaste Acara ini terjadi ketika pengguna pasta beberapa konten dalam sebuah elemen

cetak Acara

Peristiwa Deskripsi DOM
onafterprint Acara ini terjadi ketika halaman sudah mulai mencetak, atau jika kotak dialog cetak telah ditutup 3
onbeforeprint Acara ini terjadi ketika halaman adalah tentang akan dicetak 3

Acara Media

Peristiwa Deskripsi DOM
onabort Acara ini terjadi ketika pemuatan media dibatalkan 3
oncanplay Acara ini terjadi ketika browser dapat mulai bermain media (ketika telah buffered cukup untuk memulai) 3
oncanplaythrough Acara ini terjadi ketika browser dapat bermain melalui media tanpa berhenti untuk buffering 3
ondurationchange Acara ini terjadi ketika durasi media berubah 3
onemptied Acara ini terjadi ketika sesuatu yang buruk terjadi dan file media tiba-tiba tidak tersedia (like unexpectedly disconnects) 3
onended Acara ini terjadi ketika media telah mencapai akhir (useful for messages like "thanks for listening") 3
OnError Acara ini terjadi ketika terjadi kesalahan selama pemuatan file media 3
onloadeddata Acara ini terjadi ketika data media dimuat 3
onloadedmetadata Acara ini terjadi ketika meta data yang (like dimensions and duration) yang dimuat 3
onloadstart Acara ini terjadi ketika browser mulai mencari media yang ditentukan 3
onpause Acara ini terjadi ketika media dihentikan sementara oleh pengguna atau pemrograman 3
onplay Acara ini terjadi ketika media telah dimulai atau tidak lagi berhenti 3
onplaying Acara ini terjadi ketika media bermain setelah telah berhenti atau dihentikan untuk buffering 3
dalam pengembangan Acara ini terjadi ketika browser sedang dalam proses untuk mendapatkan data media (downloading the media) 3
onratechange Acara ini terjadi ketika kecepatan bermain media berubah 3
onseeked Acara ini terjadi ketika pengguna selesai bergerak / melompat-lompat ke posisi baru di media 3
onseeking Acara ini terjadi ketika pengguna mulai bergerak / melompat-lompat ke posisi baru di media 3
onstalled Acara ini terjadi ketika browser sedang mencoba untuk mendapatkan data media, namun data tidak tersedia 3
onsuspend Acara ini terjadi ketika browser sengaja tidak mendapatkan data media 3
ontimeupdate Acara ini terjadi ketika posisi bermain telah berubah (seperti ketika pengguna depan cepat ke titik yang berbeda di media) 3
onvolumechange Acara ini terjadi ketika volume media telah berubah (termasuk pengaturan volume untuk "bisu") 3
onwaiting Acara ini terjadi ketika media telah berhenti namun diperkirakan untuk melanjutkan (seperti ketika media berhenti untuk buffer lebih banyak data) 3

animasi Acara

Peristiwa Deskripsi DOM
animationend Acara ini terjadi ketika animasi CSS telah selesai 3
animationiteration Acara ini terjadi ketika animasi CSS diulang 3
animationstart Acara ini terjadi ketika animasi CSS telah dimulai 3

Acara transisi

Peristiwa Deskripsi DOM
transitionend Acara ini terjadi ketika transisi CSS telah selesai 3

Server-Sent Events

Peristiwa Deskripsi DOM
OnError Acara ini terjadi ketika terjadi kesalahan dengan sumber acara
onmessage Acara ini terjadi ketika pesan diterima melalui sumber acara
OnOpen Acara ini terjadi ketika koneksi dengan sumber acara dibuka

Acara Lain-lain

Peristiwa Deskripsi DOM
onmessage Acara ini terjadi ketika pesan yang diterima melalui atau dari suatu objek (WebSocket, Web Worker, Event Source or a child frame or a parent window) 3
onmousewheel Ditinggalkan. Gunakan onwheel acara sebaliknya
ononline Acara ini terjadi ketika browser mulai bekerja secara online 3
onoffline Acara ini terjadi ketika browser mulai bekerja secara offline 3
onpopstate Acara ini terjadi ketika sejarah jendela berubah 3
sedang tampil Acara ini terjadi ketika <menu> elemen ditampilkan sebagai menu konteks 3
onstorage Acara ini terjadi ketika area Web Storage diperbarui 3
ontoggle Acara ini terjadi ketika pengguna membuka atau menutup <details> elemen 3
onwheel Acara ini terjadi ketika roda mouse gulungan atas atau bawah lebih dari satu elemen 3

sentuh Acara

Peristiwa Deskripsi DOM
ontouchcancel Acara ini terjadi ketika disentuh terganggu
ontouchend Acara ini terjadi ketika jari dihapus dari layar sentuh
ontouchmove Acara ini terjadi ketika jari diseret di layar
ontouchstart Acara ini terjadi ketika jari ditempatkan pada layar sentuh

Obyek acara

konstanta

Konstan Deskripsi DOM
CAPTURING_PHASE Tahap acara saat ini adalah fase capture (1) 1
AT_TARGET Acara saat ini dalam tahap sasaran, yakni sedang dievaluasi pada target event (2) 2
BUBBLING_PHASE Tahap acara saat ini adalah fase menggelegak (3) 3

properti

Milik Deskripsi DOM
gelembung Pengembalian apakah peristiwa tertentu adalah acara menggelegak 2
dibatalkan Pengembalian apakah suatu peristiwa dapat memiliki aksi default dicegah 2
currentTarget Mengembalikan elemen yang pendengar acara memicu peristiwa 2
defaultPrevented Pengembalian apakah atau tidak preventDefault() metode dipanggil untuk acara 3
eventPhase Pengembalian yang fase aliran acara saat ini sedang dievaluasi 2
isTrusted Pengembalian apakah atau tidak sebuah acara dipercaya 3
target Mengembalikan elemen yang memicu peristiwa 2
timestamp Mengembalikan waktu (in milliseconds relative to the epoch) di mana acara tersebut diciptakan 2
mengetik Mengembalikan nama acara 2
melihat Mengembalikan referensi ke objek Jendela tempat acara terjadi 2

metode

metode Deskripsi DOM
preventDefault() Membatalkan acara jika dibatalkan, yang berarti bahwa aksi default yang dimiliki peristiwa itu tidak akan terjadi 2
stopImmediatePropagation() Mencegah pendengar lain dari acara yang sama dari yang disebut 3
stopPropagation() Mencegah propagasi lebih lanjut dari acara selama arus acara 2

MouseEvent Obyek

Milik Deskripsi DOM
altKey Mengembalikan apakah "ALT" tombol ditekan ketika mouse event dipicu 2
tombol Pengembalian yang tombol mouse ditekan ketika mouse event dipicu 2
kancing-kancing Pengembalian yang tombol mouse ditekan ketika mouse event dipicu 3
clientX Pengembalian horisontal koordinat pointer mouse, relatif terhadap jendela saat, ketika mouse event dipicu 2
clientY Mengembalikan koordinat vertikal dari pointer mouse, relatif terhadap jendela saat, ketika mouse event dipicu 2
ctrlKey Pengembalian apakah "CTRL" tombol ditekan ketika mouse event dipicu 2
rinci Mengembalikan angka yang menunjukkan berapa kali mouse diklik 2
metaKey Pengembalian apakah "META" tombol ditekan ketika acara ini dipicu 2
LamanX Pengembalian horisontal koordinat pointer mouse, relatif terhadap dokumen, ketika mouse event dipicu
LamanY Mengembalikan koordinat vertikal dari pointer mouse, relatif terhadap dokumen, ketika mouse event dipicu
relatedTarget Mengembalikan elemen yang terkait dengan elemen yang memicu mouse event 2
screenX Pengembalian horisontal koordinat pointer mouse, relatif terhadap layar, ketika sebuah peristiwa dipicu 2
screenY Mengembalikan koordinat vertikal dari pointer mouse, relatif terhadap layar, ketika sebuah peristiwa dipicu 2
tombol Shift Mengembalikan apakah "SHIFT" tombol ditekan ketika acara ini dipicu 2
yang Pengembalian yang tombol mouse ditekan ketika mouse event dipicu 2

KeyboardEvent Obyek

Milik Deskripsi DOM
altKey Mengembalikan apakah "ALT" tombol ditekan saat acara kunci dipicu 2
ctrlKey Mengembalikan apakah "CTRL" tombol ditekan saat acara kunci dipicu 2
charcode Mengembalikan kode karakter Unicode kunci yang memicu peristiwa onkeypress 2
kunci Mengembalikan nilai kunci dari kunci diwakili oleh acara 3
kata kunci Mengembalikan kode karakter Unicode kunci yang memicu peristiwa onkeypress, atau Unicode kode kunci kunci yang memicu onkeydown atau acara onkeyup 2
tempat Mengembalikan lokasi tombol pada keyboard atau perangkat 3
metaKey Pengembalian apakah "meta" tombol ditekan saat acara kunci dipicu 2
tombol Shift Mengembalikan apakah "SHIFT" tombol ditekan saat acara kunci dipicu 2
yang Mengembalikan kode karakter Unicode kunci yang memicu peristiwa onkeypress, atau Unicode kode kunci kunci yang memicu onkeydown atau acara onkeyup 2

HashChangeEvent Obyek

Milik Deskripsi DOM
NEWURL Mengembalikan URL dokumen, setelah hash telah berubah
OLDURL Mengembalikan URL dari dokumen, sebelum hash berubah

PageTransitionEvent Obyek

Milik Deskripsi DOM
bertahan Pengembalian apakah halaman web itu cache oleh browser

FocusEvent Obyek

Milik Deskripsi DOM
relatedTarget Mengembalikan elemen yang terkait dengan elemen yang memicu peristiwa 3

AnimationEvent Obyek

Milik Deskripsi DOM
animationName Mengembalikan nama animasi
waktu berlalu Mengembalikan jumlah detik animasi telah berjalan

TransitionEvent Obyek

Milik Deskripsi DOM
Nama properti Mengembalikan nama properti CSS terkait dengan transisi
waktu berlalu Mengembalikan jumlah detik transisi telah berjalan

WheelEvent Obyek

Milik Deskripsi DOM
deltax Mengembalikan jumlah gulir horizontal dari roda mouse (x-axis) 3
deltaY Mengembalikan jumlah gulir vertikal dari roda mouse (y-axis) 3
deltaZ Mengembalikan jumlah gulungan dari roda mouse untuk z-sumbu 3
deltaMode Mengembalikan angka yang mewakili unit pengukuran untuk nilai-nilai delta (pixels, lines or pages) 3