HTML աղյուսակի բջիջների փոփոխում JavaScript-ով
Ենթադրենք տրված է ինչ-որ HTML աղյուսակ #table:
Ենթադրենք մեր առջեւ խնդիր է դրված ինչ-որ բան անել
աղյուսակի յուրաքանչյուր բջիջի հետ, օրինակ՝ գրել
նրանցից յուրաքանչյուրում '!' տեքստը:
Եկեք քննարկենք նմանատիպ խնդրի լուծման նրբությունները:
Ինչպես գիտեք, HTML աղյուսակն ունի երկչափ կառուցվածք՝ կան տողեր, եւ դրանցում՝ բջիջներ: Հնարավոր է լուծել մեր խնդիրը հետեւյալ կերպ. ցիկլով դուրս բերել տողերը եւ յուրաքանչյուր տողում ցիկլով դուրս բերել բջիջները եւ կատարել դրանց հետ մեզ անհրաժեշտ գործողությունը: Այսինքն՝ ներկայացված սխեման նման է այն բանին, թե ինչպես մենք կստեղծեինք այդպիսի աղյուսակ՝ լրացնելով այն տողերով եւ բջիջներով:
Սակայն, այս դեպքում, երկու ներդրված ցիկլ
ավելորդ կլինեն. հնարավոր է պարզապես ստանալ բոլոր
td-ները եւ դուրս բերել դրանք ցիկլով՝ կատարելով
անհրաժեշտ գործողությունը: Եկեք անենք դա.
let tds = document.querySelectorAll('#table td');
for (let td of tds) {
td.textContent = '!';
}
Ենթադրենք տրված է ինչ-որ HTML աղյուսակ թվերով եւ կոճակ: Կոճակի սեղմման դեպքում կրկնապատկեք աղյուսակի յուրաքանչյուր բջիջի թիվը:
