add နည်းလမ်း
add နည်းလမ်းသည် သတ်မှတ်ထားသော
အစိတ်အပိုင်းများကို ရှိနှင့်ပြီးသော အစိတ်အပိုင်းများ၏ အုပ်စုထဲသို့ ထည့်သွင်းပေးသည်။
ဝါကျဖွဲ့ပုံ
selector အလိုက် ထည့်သွင်းခြင်း
.add(selector);
ထည့်သွင်းမည့် အစိတ်အပိုင်းများကို DOM အစိတ်အပိုင်း တစ်ခု သို့မဟုတ် များစွာ (array) ဖြင့် သတ်မှတ်နိုင်သည်
.add(DOM element);
ထည့်သွင်းမည့် အစိတ်အပိုင်းများကို jQuery object ဖြင့် သတ်မှတ်နိုင်သည်
.add(jQuery object);
ထည့်သွင်းမည့် အစိတ်အပိုင်းများကို html စာသားဖြင့် သတ်မှတ်နိုင်သည်
.add(html text);
ထည့်သွင်းမည့် အစိတ်အပိုင်းများကို စာမျက်နှာပေါ်တွင် ဒုတိယ parameter ဖြင့်သတ်မှတ်ထားသော နယ်ပယ်အတွင်း၌၊ သတ်မှတ်ထားသော selector ကို အသုံးပြု၍ ရှာဖွေသည်။ ရှာဖွေရန် နယ်ပယ်ကို DOM element၊ jQuery object သို့မဟုတ် document object ဖြင့် သတ်မှတ်နိုင်သည်
.add(selector, context);
နမူနာ
စာပိုဒ်အားလုံးကို ရှာကြည့်ပါ၊ ၎င်းတို့၏ နောက်ဆုံးတွင်
'!' စာသားကို ထည့်ပေးပါ၊ ထို့နောက် ရှာတွေ့ထားသော စာပိုဒ်များထဲသို့
h2
ခေါင်းစဉ်များကို ထပ်မံထည့်သွင်းပါ
ပြီးတော့ ခေါင်းစဉ်များနှင့် စာပိုဒ်များအတွက်
အနီရောင်ကို တစ်ပြိုင်နက် သတ်မှတ်ပေးပါ
<div>ddd</div>
<h1>hhh</h1>
<p>ppp</p>
<div id="test"><h2>hhh</h2></div>
<p>ppp</p>
<h2>hhh</h2>
<p>ppp</p>
$('p').append('!').add('h2').css('color', 'red');
နမူနာ
ရှာဖွေရန် context ကို ထည့်သွင်းကြည့်ပါ -
#test element အတွင်း၌ ရှိသော
h2 များကိုသာ ထည့်သွင်းပါ
let $context = $('#test');
$('p').append('!').add('h2', $context).css('color', 'red');
နမူနာ
JavaScript ၏
querySelector နည်းလမ်းကို အသုံးပြု၍
DOM element ပုံစံရှိ ရှာဖွေရန် context တစ်ခုကို ဖန်တီးပါ
let context = document.querySelector('#test');
$('p').append('!').add('h2', context).css('color', 'red');
နမူနာ
များသောအားဖြင့် context မပါဘဲလည်း ရနိုင်သည်၊ ရှုပ်ထွေးသော selector တစ်ခုကို ပြုလုပ်ခြင်းဖြင့်
$('p').append('!').add('#test h2').css('color', 'red');
