Register Event Handler Via Inline Model

Cara ini juga sebenarnya bisa dikatakan 'tradisional model', tetapi banyak juga mengartikan cara ini adalah 'inline model'.

Sebelumnya...
Fungsi yang menghandle event dinamakan event handler. Proses meregister event handler kepada event di suatu node DOM dinamakan registering an event handler.

Cara ini event akan diperlakukan sebagai atribut elemen.

Setiap elemen yang mendukung atribut, dimungkinkan dia mempunyai atribut. Atribut yang sering ditugaskan adalah atribut umum, misalnya ID, CLASS, LANG, TITLE, dst. Tetapi, ada juga atribut yang dinamakan 'atribut event', yaitu di mana kita diperbolehkan meregister event handler kepada atribut event di dalam tag awal elemen yang ada, dan cara ini disebut 'inline model'.

Contoh berikut meregister event handler untuk atribut event ONCLICK didalam elemen BUTTON:

<BUTTON ONCLICK="alert('Halo saya event handler!')">Klik disini</BUTTON>

Contoh kode di atas, terlihat bahwa event handler secara langsung ditambahkan di dalam tag awal dari elemen BUTTON. Ketika elemen BUTTON tersebut diklik oleh pengguna, event handler dari 'click' akan dijalankan.

Tetapi sering pula nilai untuk atribut event adalah function call, di mana cara ini function akan dipanggil ketika event yang ditetapkan terjadi.

Contoh berikut akan mempunyai fungsi yang sama seperti contoh sebelumnya:

<SCRIPT TYPE="text/javascript"> function handleClick(){ alert('Halo saya event handler!'); } </SCRIPT> <BUTTON ONCLICK="handleClick()">Klik disini</BUTTON>