Тағйир додани ҳуҷраҳои ҷадвали HTML бо JavaScript

Бигзор як ҷадвали HTML #table дода шуда бошад. Бигзор пешмоҳи мо вазифаи анҷом додани чизе бо ҳар як ҳуҷраи ҷадвал, масалан, навиштани дар ҳар яки онҳо матни '!' бошад.

Биёед нюансҳои ҳалли чунин вазифаро муҳокима кунем.

Чинон ки шумо медонед, ҷадвали HTML сохтори дученака дорад: сатрҳо мавҷуданд, ва дар онҳо ҳуҷраҳо ҳастанд. Мумкин аст вазифаи худро ба тариқи зерин ҳал кунем: сикли сатрҳоро гузаронида, ва дар ҳар як сатр ҳуҷраҳоро бо сикл гузаронида ва амали дилхоҳро бо онҳо анҷом диҳем. Яъне схеман пешниҳодкарда ба он монанд аст, ки мо чунин ҷадвалеро эҷод карда будем, онро бо сатрҳо ва ҳуҷраҳо пур мекардем.

Аммо, дар ин ҳолат, ду сикли дарунсохт бегона хоҳанд буд: танҳо ҳамаи td-ҳоро гирифта ва онҳоро бо сикл гузаронида, амали заруриро иҷро кардан мумкин аст. Биёед ин корро кунем:

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

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

Бигзор як ҷадвали HTML бо рақамҳо ва тугма дода шуда бошад. Бо пахш кардан ба тугма рақамро дар ҳар як ҳуҷраи ҷадвал ду баробар зиёд кунед.