Промена на ќелиите во HTML табела со JavaScript

Нека е дадена одредена HTML табела #table. Нека пред нас стои задачата да направиме нешто со секоја ќелија од табелата, на пример, да запишеме во секоја од нив текст '!'.

Ајде да разговараме за нијансите во решавањето на ваква задача.

Како што знаете, HTML табелата има дводимензионална структура: има редови, а во нив ќелии. Можеме да ја решиме нашата задача на следниов начин: да ги поминеме со циклус редовите и во секој ред да ги поминеме со циклус ќелиите и да направиме со нив дејството што ни е потребно. Односно, дадената шема за решение е слична на тоа како ние би ја создале таква табела, пополнувајќи ја со редови и ќелии.

Сепак, во овој случај, два вгнездени циклуси ќе бидат излишни: може едноставно да се добијат сите td и да се поминат со циклус, изведувајќи ја потребната операција. Ајде да го направиме ова:

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

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

Нека е дадена одредена HTML табела со броеви и копче. При притискање на копчето, зголемете го бројот во секоја ќелија од табелата за два пати.