HTML cədvəlinin xanalarının JavaScript-də dəyişdirilməsi
Tutaq ki, müəyyən bir HTML cədvəli #table verilib.
Qarşımızda hər bir xanası ilə nə etmək vəzifəsi durur,
məsələn, hər birinə '!' mətnini yazmaq.
Gəlin belə bir vəzifənin həllinin nüanslarını müzakirə edək.
Bildiyiniz kimi, HTML cədvəlinin iki ölçülü quruluşu var: sətirlər və onların içində xanalar var. Bizim vəzifəmizi aşağıdakı kimi həll etmək olar: dövrə ilə sətirləri, hər sətirdə isə dövrə ilə xanaları gəzmək və onlarla lazımi əməliyyatı yerinə yetirmək. Yəni təqdim olunan həll sxemi elədir ki, sanki biz həmin cədvəli sətirlər və xanalarla dolduraraq yaradırdıq.
Lakin, bu halda, iki daxili dövr lazımsız olardı:
sadəcə bütün td-ləri götürmək və onları dövrə
ilə gəzərək lazımi əməliyyatı yerinə yetirmək olar.
Bunu edək:
let tds = document.querySelectorAll('#table td');
for (let td of tds) {
td.textContent = '!';
}
Tutaq ki, ədədlər olan müəyyən bir HTML cədvəli və düymə verilib. Düyməyə kliklədikdə cədvəlin hər bir xanasındakı ədədi iki dəfə artırın.
