Ndryshimi i Qelizave të Tabelës HTML në JavaScript

Le të themi se kemi një tabelë HTML #table. Le të supozojmë se detyra jonë është të bëjmë diçka me çdo qelizë të tabelës, për shembull, të shkruajmë në secilën prej tyre tekstin '!'.

Le të diskutojmë nuancat e zgjidhjes së një detyre të tillë.

Siç e dini, një tabelë HTML ka një strukturë dy-dimensionale: ka rreshta dhe brenda tyre ka qeliza. Mund të zgjidhim detyrën tonë si më poshtë: të përsërisim përmes rreshtave me një cikël dhe në çdo rresht të përsërisim përmes qelizave me një cikël dhe të kryejmë veprimin e nevojshëm me to. Kjo do të thotë, skema e përshkruar e zgjidhjes është e ngjashme me mënyrën se si do të krijonim një tabelë të tillë, duke e mbushur me rreshta dhe qeliza.

Megjithatë, në këtë rast, dy cikle të mbivendosur do të ishin të panevojshme: mund thjesht të merren të gjitha td dhe t'i përsëritim me një cikël, duke kryer operacionin e kërkuar. Le ta bëjmë këtë:

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

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

Le të themi se kemi një tabelë HTML me numra dhe një buton. Me klikim në buton, dyfishoni numrin në çdo qelizë të tabelës.