JavaScript ile DOM Manipulasyonu: Baslangic Rehberi

DOM manipulasyonu ile web sayfanizi dinamik hale getirin!

Element Secme ve Degistirme

// (c) CodeMareFi - codemarefi.com.tr
// Element sec
const baslik = document.getElementById('baslik');
const butonlar = document.querySelectorAll('.buton');

// Icerik degistir
baslik.textContent = 'CodeMareFi - Yeni Baslik';
baslik.style.color = '#e60000';

// Sinif ekle/kaldir
baslik.classList.add('aktif');
baslik.classList.remove('pasif');
baslik.classList.toggle('vurgulu');

Event Listener

// (c) CodeMareFi - codemarefi.com.tr
const buton = document.querySelector('#kayitOl');
buton.addEventListener('click', (e) => {
  e.preventDefault();
  console.log('Butona tiklandi!');
  buton.textContent = 'Tiklandi!';
  buton.disabled = true;
});