Pertemuan 6 – JavaScript Dasar dan Manipulasi DOM

← Kembali ke Beranda

Tujuan Pembelajaran

Mahasiswa memahami konsep JS dasar (variabel, tipe data, fungsi), serta manipulasi DOM dan event handling untuk interaktivitas web.

Pengenalan JavaScript

JS adalah bahasa pemrograman untuk web interaktif. Dijalankan di browser, membuat halaman dinamis. Tanpa JS, web statis seperti buku.

Konsep Dasar

  • Variabel: Penyimpan data, let/const nama = "John".
  • Tipe Data: String ("teks"), Number (123), Boolean (true), Array [1,2,3], Object {key: value}.
  • Operator: + (tambah), == (sama), && (dan).
  • Fungsi: Blok kode, function sapa() { alert("Hi"); }.

Manipulasi DOM dan Event Handling

DOM adalah representasi HTML. Manipulasi: getElementById, innerHTML. Event: addEventListener('click', fungsi).

Contoh Kode

let nama = "John";
function ubahTeks() {
    document.getElementById("teks").innerHTML = "Halo " + nama;
}

document.getElementById("btn").addEventListener("click", ubahTeks);
                

Tips Praktis

  • Gunakan console.log untuk debug.
  • JS case-sensitive, hati-hati typo.
  • Praktik di JSFiddle untuk test cepat.

Ringkasan

JS buat web hidup. DOM manipulasi ubah konten, event tanggapi user.

Latihan

1. Buat variabel dan fungsi JS. 2. Manipulasi DOM ub