Získanie skupiny prvkov v JavaScripte

V predchádzajúcich lekciách sme pomocou metódy querySelector získali jeden prvok stránky. Teraz je čas naučiť sa získať skupinu prvkov a vykonávať operácie s viacerými prvkami naraz.

Na to existuje metóda querySelectorAll, ktorá získava všetky elementy, ktoré spĺňajú CSS selektor, vo forme poľa prvkov. Ak chceme niečo urobiť s nájdenými prvkami, je potrebné pracovať s získaným poľom, napríklad prechádzať ho cyklom a v cykle vykonať akúkoľvek operáciu s každým prvkom samostatne.

Nech sú napríklad dané odseky s triedou www:

html<p class="www">text1</p>
<p class="www">text2</p>
<p class="www">text3</p>

Získajme pole týchto odsekov, prejdime ich cyklom a v cykle vypíšme texty nájdených odsekov do konzoly:

javascriptlet elems = document.querySelectorAll('.www');

for (let elem of elems) {
  console.log(elem.textContent);
}

A teraz na koniec textu každého odseku pridajme výkričník:

javascriptlet elems = document.querySelectorAll('.www');

for (let elem of elems) {
  elem.textContent = elem.textContent + '!';
}