JavaScript'te DOM Öğesi Elde Etme

Şimdi, sayfanın DOM öğelerini nasıl elde edeceğimizi öğreneceğiz, böylece daha sonra onlarla çeşitli manipülasyonlar yapabileceğiz.

Bir butonumuz olduğunu varsayalım:

<input id="button" type="submit">

Şimdi bu butona bir referansı bir değişkene atayalım. Bunun için, özel document nesnesinin querySelector metodunu kullanmalıyız. Bu metot, parametre olarak bir CSS seçici alır ve bu seçiciye göre bulunan öğeye bir referans döndürür.

Butonumuzun button değerine sahip bir id özniteliği var. Bu, butonu #button seçicisiyle bulabileceğimiz anlamına gelir. Öyleyse, butonumuzu bulalım ve ona olan referansı bir değişkene kaydedelim:

let button = document.querySelector('#button');
console.log(button);

3 paragraf verilmiştir:

<p id="elem1">1</p>
<p id="elem2">2</p>
<p id="elem3">3</p>

Her bir paragrafa olan referansı ayrı bir değişkene kaydedin ve bu değişkenlerin her birinin içeriğini konsola yazdırın.