HTML DOM Element insertBefore() စမ်းသပ်ခ�င်း

အသုံးပြုခြင်း နှင့် အခြေအနေ

insertBefore() အခြား အပိုင်း ထိပ်ထိုးပေးသည်

အခြား ကိုယ်စားပြုသည်

appendChild() စမ်းသပ်ခ�င်း

replaceChild() စမ်းသပ်ခ�င်း

removeChild() စမ်းသပ်ခ�င်း

remove() စမ်းသပ်ခြင်း

childNodes အရေးယူဆောင်ရခြင်း

firstChild အရေးယူဆောင်ရခြင်း

lastChild အရေးယူဆောင်ရခြင်း

firstElementChild အရေးယူဆောင်ရခြင်း

lastElementChild အရေးယူဆောင်ရခြင်း

အကျိုးသတ္တု

ဘာသာ 1

  1. <li> အပိုင်း ဖန်တီးသည်
  2. စာကြိုး အပိုင်း ဖန်တီးသည်
  3. အခြား <li> အပိုင်း သို့ စာကြိုးတင်သည်
  4. ကျောက်သုံး<ul> တွင် ပထမဆုံး ကလေးအပိုင်း အခြား အခြား <li> အပိုင်း ထိပ်ထိုးပေးသည်:
const newNode = document.createElement("li");
const textNode = document.createTextNode("Water");
newNode.appendChild(textNode);
const list = document.getElementById("myList");
list.insertBefore(newNode, list.children[0]);

ကိုယ်တိုင် ကြိုးစားခြင်း

အမှတ် 2

အဆင်းပြင် ကြွေးမြီ တစ်ခုမှ အဆင်းပြင် ကြွေးမြီ အစား ပြောင်းရွှေ့ခြင်း

const node = document.getElementById("myList2").lastElementChild;
const list = document.getElementById("myList1");
list.insertBefore(node, list.children[0]);

ကိုယ်တိုင် ကြိုးစားခြင်း

အမှတ် 3

အဆင်းပြင် ကြွေးမြီ တစ်ခုမှ အဆင်းပြင် ကြွေးမြီ တစ်ခုသို့ ပြောင်းရွှေ့ခြင်း

const node = document.getElementById("myList2").lastElementChild;
const list = document.getElementById("myList1");
list.insertBefore(node, null);

ကိုယ်တိုင် ကြိုးစားခြင်း

အပြုအမူ

element.insertBefore(newnode, existingnode)

သို့မဟုတ်

node.insertBefore(newnode, existingnode)

ပြင်ပ

ပြင်ပ ဖောင်း
newnode လိုအပ်ချက် ဖြည့်စွက် ဖြစ်စဉ်
existingnode

လိုအပ်ချက် မပြောဆိုခဲ့ကြောင်း ဖြည့်စွက် ဖြစ်စဉ် ဖြည့်စွက် newnode

အချက်အလက် မပြောဆိုခဲ့ကြောင်း ဖောင်း insertBefore ဖောင်း နောက်ဆုံး ဖြည့်စွက် newnode

ဖြောင်း

ဖြောင်း ဖောင်း
ဖောင်း ဖြည့်စွက် ဖောင်း

ဖြည့်စွက် ဖောင်း

element.insertBefore() ဖောင်း DOM Level 1 (1998) ဖောင်း

အားလုံး ဖြည့်စွက် ဖောင်း တူညီ။

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
ထောက်ပံ့ 9-11 ထောက်ပံ့ ထောက်ပံ့ ထောက်ပံ့ ထောက်ပံ့