HTML jadval hujayralarini JavaScript-da o'zgartirish

Ma'lum bir HTML jadvali #table berilgan bo'lsin. Oldimizga har bir hujayra bilan biror nima qilish vazifasi qo'yilgan, masalan, ularning har biriga '!' matnini yozish.

Keling, bunday vazifani yechishning nozik tomonlarini muhokama qilaylik.

Bilganingizdek, HTML jadvali ikki o'lchovli tuzilishga ega: qatorlar bor va ularning ichida hujayralar bor. Bizning vazifamizni quyidagicha yechish mumkin: tsikl bilan qatorlarni aylantirish va har bir qatorda tsikl bilan hujayralarni aylantirish va ular bilan bizga kerakli amalni bajarish. Ya'ni, keltirilgan yechim sxemasi, biz bunday jadvalni qatorlar va hujayralar bilan to'ldirib yaratganimizdagiga o'xshaydi.

Biroq, bu holda, ikkita ichki-ichki tsikl ortiqcha bo'ladi: shunchaki barcha td larni olish va tsikl bilan ularni aylantirish, kerakli operatsiyani bajarish mumkin. Buni amalga oshiramiz:

let tds = document.querySelectorAll('#table td');

for (let td of tds) {
	td.textContent = '!';
}

Raqamlar bilan ma'lum bir HTML jadvali va tugma berilgan bo'lsin. Tugmani bosishda jadvalning har bir hujayrasidagi raqamni ikki barobar oshiring.