JavaScript တွင် အစိတ်အပိုင်းများကို အသက်ဝင်အောင်လုပ်ခြင်း

ကျွန်ုပ်တို့တွင် အချည်းနှီးဖြစ်သော ဆဲလ်များပါရှိသည့် HTML ဇယား#table တစ်ခုရှိသည်ဆိုပါစို့။

မည်သည့်ဆဲလ်ကိုမဆို နှိပ်လိုက်သောအခါ ၎င်းဆဲလ်သည် အခြေအနေတစ်ခုခု အသက်ဝင်လာစေရန် ပြုလုပ်ကြည့်ကြပါစို့။ ဥပမာအားဖြင့် နီရဲသောနောက်ခံအရောင်ဖြစ်လာစေရန်။ ဤသို့ပြုလုပ်ရန်အတွက် အသက်ဝင်သောဆဲလ်များကို CSS class တစ်ခုခု ပေးမည်။

.active {
	background: red;
}

အသက်ဝင်အောင်လုပ်ခြင်းကို အကောင်အထည်ဖော်ကြပါစို့။

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

for (let td of tds) {
	td.addEventListener('click', function() {
		this.classList.add('active');
	});
}

HTML စာရင်းul တစ်ခုကို ပေးထားသည်။ စာရင်းရှိ မည်သည့်အမှတ်ကိုမဆို နှိပ်လိုက်သောအခါ ၎င်းသည် နီရဲသောနောက်ခံဖြင့် အသက်ဝင်လာစေရန် ပြုလုပ်ပါ။

ယခင်တာဝန်ကို အသက်ဝင်ပြီးသား စာရင်းအမှတ်တစ်ခုကို နှိပ်လိုက်သောအခါ ၎င်းမှ အသက်ဝင်ခြင်းအခြေအနေကို ရုပ်သိမ်းပေးစေရန် ပြင်ဆင်ပါ။