Mendapatkan Kumpulan Elemen dalam JavaScript

Dalam pelajaran sebelumnya, kita menggunakan kaedah querySelector untuk mendapatkan satu elemen halaman. Sekarang tiba masanya untuk belajar mendapatkan kumpulan elemen dan melakukan beberapa operasi sekali gus dengan banyak elemen.

Untuk ini, terdapat kaedah querySelectorAll, yang mendapatkan semua tag yang sesuai dengan pemilih CSS, dalam bentuk tatasusunan elemen. Untuk melakukan sesuatu dengan elemen yang ditemui, perlu bekerja dengan tatasusunan yang diperoleh, contohnya, mengulanginya dengan gelung dan dalam gelung melaksanakan beberapa operasi dengan setiap elemen secara berasingan.

Katakan, sebagai contoh, kita mempunyai perenggan dengan kelas www:

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

Mari dapatkan tatasusunan perenggan ini, ulangi mereka dengan gelung dan dalam gelung outputkan teks perenggan yang ditemui ke konsol:

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

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

Sekarang mari tambahkan tanda seru pada akhir teks setiap perenggan:

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

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