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
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 |