Rabu

JavaScript dan HTML

Dalam pelajaran sebelumnya, kita telah belajar tentang sintaks JavaScript, namun kita belum belajar bagaimana untuk "melampirkan" JavaScript untuk elemen HTML kita. Itulah yang saya akan menunjukkan kepada Anda dalam pelajaran ini.
Standalone JavaScript

Pertama, mari kita lihat apa yang sepotong mandiri JavaScript terlihat seperti.

<script type="text/javascript">
<! -
alert ('Hei, ingat untuk memberitahu teman Anda tentang Quackit.com!');
->
</ Script>

Jika kita menempatkan JavaScript di atas antara tag 'kepala' (atau 'tubuh' tag), itu akan berjalan segera setelah kami beban halaman.

Sekarang ini baik-baik saja - selama Anda ingin menjalankannya segera setelah beban halaman!

Tapi, bagaimana jika Anda tidak ingin menjalankannya segera setelah beban halaman? Bagaimana jika Anda hanya ingin menjalankannya ketika pengguna mengklik sebuah tombol?

Mudah! Ini adalah di mana Anda perlu menggunakan sebuah "event handler".
Apa itu Event Handler?

Dalam JavaScript / HTML, sebuah event handler memungkinkan Anda untuk melampirkan JavaScript Anda ke elemen HTML Anda.

Event handler memungkinkan halaman web Anda untuk mendeteksi ketika suatu "peristiwa" yang diberikan telah terjadi, sehingga dapat menjalankan beberapa kode JavaScript. Sebuah contoh dari sebuah "peristiwa" dapat dikatakan, klik pada elemen HTML.

Dalam kode Anda, sebuah event handler hanyalah sebuah atribut khusus yang Anda tambahkan ke elemen HTML Anda. Misalnya, untuk menjalankan JavaScript beberapa saat pengguna mengklik elemen, Anda menambahkan atribut onClick untuk elemen.

Contoh di bawah ini menunjukkan ini untuk Anda.
Menambahkan JavaScript untuk sebuah Elemen HTML

Berikut adalah contoh dasar JavaScript untuk menambahkan elemen HTML. Dalam hal ini, saat pengguna mengklik tombol kita, kotak peringatan JavaScript ditampilkan. Hal ini dilakukan dengan menambahkan atribut onClick dan menempatkan kode JavaScript kotak peringatan ke dalamnya.

Bila Anda menggunakan JavaScript seperti ini, Anda tidak perlu menggunakan tag script (seperti yang kami lakukan di atas). Cukup tempat JavaScript Anda dalam event handler dan akan bekerja.


KODE 1:

0 komentar:

 
Design by Wordpress Theme | Bloggerized by Free Blogger Templates | coupon codes