Diskon kelas baru hingga 25%! Masukkan kupon "lebihcepat" di kelas ini

X
Logo Koala Skodev mengetik

Skodev

Belajar coding dalam bahasa Indonesia

CARA MENGGUNAKAN JAVASCRIPT PADA HTML

Pelajari cara menggunakan JavaScript pada HTML dengan mudah dan efektif melalui artikel ini. Ideal untuk pemula yang mencari panduan langkah demi langkah dalam penggunaan JavaScript pada HTML.

Daftar Isi:

Menambahkan JavaScript ke HTML...
Menulis JavaScript dalam File ...
Menggunakan Event HTML

Dalam dunia pengembangan web, JavaScript dan HTML adalah alat penting yang perlu dikuasai oleh setiap pengembang. Melalui artikel ini, Kamu akan belajar bagaimana menggunakan JavaScript dalam HTML dan membuat situs web Kamu lebih interaktif dan dinamis.

Menambahkan JavaScript ke HTML

Cara termudah untuk menambahkan kode JavaScript ke halaman HTML Kamu adalah dengan menggunakan tag ”” untuk memastikan bahwa seluruh halaman dimuat terlebih dahulu sebelum script dijalankan.

Contoh penggunaan:

<!DOCTYPE html>
<html>
<body>

<h1>Contoh Halaman HTML</h1>

<p>Paragraf pertama.</p>

<script>
alert("Ini adalah pesan JavaScript!");
</script>

</body>
</html>

Di sini, fungsi alert() adalah fungsi JavaScript yang akan menampilkan kotak pesan pop-up kepada pengguna. Teks dalam tanda kurung merupakan pesan yang akan ditampilkan.

Ketika Kamu bekerja dengan kode JavaScript yang lebih besar, lebih baik untuk meletakkan kode tersebut dalam file terpisah. Hal ini bisa membuat kode Kamu lebih rapi dan mudah dibaca.

Untuk melakukannya, Kamu cuk buat file baru dengan ekstensi “.js” dan menulis kode JavaScript Kamu di sana. Kemudian, dengan tag ”

Contoh penggunaan:

<!DOCTYPE html>
<html>
<body>

<h1>Contoh Halaman HTML</h1>

<p>Paragraf pertama.</p>

<script src="scriptku.js"></script>

</body>
</html>

Menggunakan Event HTML

JavaScript juga memungkinkan Kamu untuk mengeksekusi kode berdasarkan peristiwa tertentu, seperti saat pengguna mengklik tombol atau saat halaman selesai dimuat. Ini dapat dilakukan dengan menambahkan atribut “on event” ke elemen HTML Kamu, yang nilai dari atribut ini adalah fungsi JavaScript yang Kamu ingin jalankan.

Contoh penggunaan:

<!DOCTYPE html>
<html>
<body>

<button onclick="alert('Kamu mengklik tombol!')">Klik Saya!</button>

</body>
</html>

Dalam contoh di atas, saat tombol di-klik, fungsi alert() akan dijalankan dan menampilkan pesan “Kamu mengklik tombol!“.

Dengan memahami cara menggunakan JavaScript dalam HTML, Kamu telah melangkah lebih jauh dalam perjalanan Kamu menjadi pengembang web yang handal. Selanjutnya, Kamu bisa mulai belajar tentang DOM (Document Object Model) untuk memanipulasi elemen HTML dengan JavaScript secara lebih lanjut.

cover kelas Kelas membuat website dengan HTML dan CSS
Kelas membuat website dengan HTML dan CSS

belajar membuat website kamu dari nol. Cocok untuk pemula

Lihat Kelas

Daftar newsletter skodev masukkan emailmu untuk dapat informasi menarik dari dunia koding