JavaScript ile DOM Manipülasyonu: Temel Kavramlar

JavaScript, web sayfalarında dinamik değişiklikler yapmak için güçlü bir araçtır. DOM (Document Object Model), bir web sayfasındaki tüm HTML elemanlarını JavaScript ile kontrol etmenizi sağlar.

Bir HTML elementine erişmek için document.getElementById(), document.querySelector() gibi yöntemler kullanılır. Örneğin:

const heading = document.getElementById('main-heading');
heading.textContent = 'Yeni Başlık';

Bir elementin stilini değiştirmek için style özelliği kullanılabilir:

heading.style.color = 'blue';

Yeni bir element oluşturmak ve sayfaya eklemek için createElement() ve appendChild() yöntemleri kullanılır:

const newElement = document.createElement('p');
newElement.textContent = 'Bu yeni bir paragraf.';
document.body.appendChild(newElement);

Sonuç olarak, DOM manipülasyonu, interaktif ve dinamik kullanıcı deneyimleri oluşturmak için JavaScript’in temel taşlarından biridir.