insertAdjacentText နည်းလမ်း
insertAdjacentText နည်းလမ်းသည်
စာမျက်နှာ၏ မည်သည့်နေရာတွင်မဆို စာတန်းတစ်ခုကို ထည့်သွင်းနိုင်စေပါသည်။ စာတန်းကို
အကိုးခံ element နှင့် နှိုင်းယှဉ်၍ ထည့်သွင်းပါသည်။
အကိုးခံ element ၏ ရှေ့တွင် (ထည့်သွင်းနည်းလမ်း 'beforeBegin')၊ ၎င်း၏
နောက်တွင် (ထည့်သွင်းနည်းလမ်း 'afterEnd')၊ ပြီးလျှင် အကိုးခံ element ၏
အစတွင် (ထည့်သွင်းနည်းလမ်း 'afterBegin')
သို့မဟုတ် အဆုံးတွင် (ထည့်သွင်းနည်းလမ်း 'beforeEnd')
ထည့်သွင်းနိုင်ပါသည်။
ဖွဲ့စည်းပုံ
အကိုးခံ element.insertAdjacentText(ထည့်သွင်းနည်းလမ်း, ထည့်သွင်းမည့်စာသား);
ဥပမာ . နည်းလမ်း beforeBegin
အကိုးခံ element သည် #target element ဖြစ်သည်ဆိုပါစို့။
၎င်း၏ရှေ့တွင် စာသားတစ်ခုခုကို ထည့်သွင်းကြည့်ပါမည်။
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('beforeBegin', 'text');
ကုဒ် run ပြီးနောက် ရလဒ်။
text
<div id="target">
<p>elem</p>
</div>
ဥပမာ . နည်းလမ်း afterEnd
ယခု အကိုးခံ element ၏ နောက်တွင် စာတန်းအသစ်တစ်ခု ထည့်သွင်းကြည့်ပါမည်။
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('afterEnd', 'text');
ကုဒ် run ပြီးနောက် ရလဒ်။
<div id="target">
<p>elem</p>
</div>
text
ဥပမာ . afterBegin
အကိုးခံ element ၏ အစတွင် စာတန်းအသစ်တစ်ခု ထည့်သွင်းကြည့်ပါမည်။
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('afterBegin', 'text');
ကုဒ် run ပြီးနောက် ရလဒ်။
<div id="target">
text
<p>elem</p>
</div>
ဥပမာ . နည်းလမ်း beforeEnd
အကိုးခံ element ၏ အဆုံးတွင် စာတန်းအသစ်တစ်ခု ထည့်သွင်းကြည့်ပါမည်။
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('beforeEnd', 'text');
ကုဒ် run ပြီးနောက် ရလဒ်။
<div id="target">
<p>elem</p>
text
</div>
ဆက်လက်လေ့လာရန်
-
insertAdjacentElementနည်းလမ်း,
သည်လည်း element ကို သတ်မှတ်ထားသောနေရာတွင် ထည့်သွင်းပေးသည် -
insertAdjacentHTMLနည်းလမ်း,
သည်လည်း ကုဒ်ကို သတ်မှတ်ထားသောနေရာတွင် ထည့်သွင်းပေးသည် -
prependနည်းလမ်း,
သည်လည်း element များကို အစတွင် ထည့်သွင်းပေးသည် -
appendနည်းလမ်း,
သည်လည်း element များကို အဆုံးတွင် ထည့်သွင်းပေးသည် -
appendChildနည်းလမ်း,
သည်လည်း element များကို မိဘ element ၏ အဆုံးတွင် ထည့်သွင်းပေးသည် -
insertBeforeနည်းလမ်း,
သည်လည်း element များကို သတ်မှတ်ထားသော element ၏ ရှေ့တွင် ထည့်သွင်းပေးသည်
