DOM element ကို function parameter အဖြစ်ပို့ဆောင်ခြင်း

ယခင်သင်ခန်းစာများတွင် ကျွန်ုပ်တို့၏ function များသို့ element selector များပို့ဆောင်ခဲ့ပြီး ကျွန်ုပ်တို့၏ function များသည် ၎င်းတို့၏ code အတွင်း၌ ထို element များ၏ reference များကိုကိုယ်တိုင်ရယူခဲ့ကြသည်။ အခြားနည်းလမ်းတစ်ခုလည်းရှိပါသည်။ function ထဲသို့ ယခင်ကရရှိထားပြီးသော element များ၏ reference များကိုပို့ဆောင်နိုင်သည်။

ဥပမာတစ်ခုကိုကြည့်ကြပါစို့။ ကျွန်ုပ်တို့၌ အောက်ပါ code ရှိသည်ဆိုပါစို့။

<p id="elem1"></p>
<p id="elem2"></p>

setText function တစ်ခုပြုလုပ်ကြပါစို့။ ပထမ parameter အနေဖြင့် DOM element တစ်ခု၏ reference ကိုလက်ခံမည်၊ ဒုတိယ parameter အနေဖြင့် element ၏ text ကိုလက်ခံမည်။

function setText(elem, text){
	elem.textContent = text;
}

ကျွန်ုပ်တို့၏ စာပိုဒ်များအတွက် text သတ်မှတ်ရန် ကျွန်ုပ်တို့ဖန်တီးထားသော function ကိုအသုံးပြုကြပါစို့။

let elem1 = document.getElementById('elem1');
setText(elem1, 'text1');

let elem2 = document.getElementById('elem2');
setText(elem2, 'text2');

appendText function တစ်ခုပြုလုပ်ပါ။ ပထမ parameter အနေဖြင့် DOM element ကိုလက်ခံမည်၊ ဒုတိယ parameter အနေဖြင့် text ကိုလက်ခံမည်။ ဤ function သည် text ကို ထို element ၏နောက်ဆုံးတွင်ထည့်ပေးရန် ပြုလုပ်ပေးပါ။

စာပိုဒ်များကိုပေးထားသည်။ ၎င်းတို့ကိုရယူပါ၊ loop ဖြင့်လှည့်ပါ ထို့နောက် ယခင်ပြဿနာတွင်ပြုလုပ်ထားသော appendText function ကို အသုံးပြု၍ တစ်ခုစီ၏နောက်တွင် '!' ထည့်ပါ။

setValue function တစ်ခုပြုလုပ်ပါ။ ပထမ parameter အနေဖြင့် input ၏ reference ကိုလက်ခံမည်၊ ဒုတိယ parameter အနေဖြင့် text ကိုလက်ခံမည်။ ဤ function သည် ပို့ဆောင်ထားသော text ကို input ၏ value တွင်သတ်မှတ်ပေးရန် ပြုလုပ်ပေးပါ။