Získání DOM elementu v JavaScriptu

Nyní se naučíme získávat DOM elementy stránky, abychom s nimi později mohli provádět různé manipulace.

Předpokládejme, že máme nějaké tlačítko:

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

Získame odkaz na toto tlačítko do proměnné. K tomu bychom měli použít metodu querySelector speciálního objektu document. Tato metoda přijímá jako parametr CSS selektor a vrací odkaz na element nalezený podle tohoto selektoru.

Naše tlačítko má atribut id s hodnotou button. To znamená, že můžeme nalézt toto tlačítko podle selektoru #button. Pojďme tedy najít naše tlačítko a zapsat odkaz na něj do proměnné:

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

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