HTML DOM Document createDocumentFragment()
ဥပမာများ
အလွတ်စာရင်းသို့ အစိတ်အပိုင်းများကို ထည့်ပါ-
const fruits = ["Banana", "Orange", "Mango"];
// Create a document fragment:
const fragment = document.createDocumentFragment();
// Add li elements to the fragment:
for (let x in fruits) {
const li = document.createElement('li');
li.textContent = fruits[x];
dFrag.appendChild(li);
}
// Add fragment to a list:
document.getElementById('myList').appendChild(fragment);
ရှိပြီးသားစာရင်းသို့ အစိတ်အပိုင်းများကို ထည့်ပါ-
const fruits = ["Banana", "Orange", "Mango"];
// Create a document fragment:
const fragment = document.createDocumentFragment();
// Add li elements to the fragment:
for (let x in fruits) {
const li = document.createElement('li');
li.textContent = fruits[x];
dFrag.appendChild(li);
}
// Add fragment to a list:
document.getElementById('myList').appendChild(fragment);
အဓိပ္ပါယ်နှင့် အသုံးပြုမှု
createDocumentFragment()
နည်းလမ်းသည် offscreen node တစ်ခုကို ဖန်တီးသည် ။
မည်သည့်စာရွက်စာတမ်းတွင်မဆို ထည့်သွင်းနိုင်သော စာရွက်စာတမ်းအပိုင်းအစအသစ်တစ်ခုကို တည်ဆောက်ရန်အတွက် offscreen node ကို အသုံးပြုနိုင်သည်။
ဤ createDocumentFragment()
နည်းလမ်းကို စာရွက်စာတမ်းတစ်ခု၏ အစိတ်အပိုင်းများကို ထုတ်ယူရန်၊ အကြောင်းအရာအချို့ကို ပြောင်းလဲရန်၊ ထည့်ရန် သို့မဟုတ် ဖျက်ရန်နှင့် ၎င်းကို စာရွက်စာတမ်းသို့ ပြန်ထည့်ရန် နည်းလမ်းကိုလည်း အသုံးပြုနိုင်သည်။
မှတ်ချက်
HTML အစိတ်အပိုင်းများကို အမြဲတိုက်ရိုက်တည်းဖြတ်နိုင်ပါသည်။ ဒါပေမယ့် ပိုကောင်းတဲ့နည်းလမ်းကတော့ (offscreen) document fragment တစ်ခုကို တည်ဆောက်ပြီး ဒီအပိုင်းအစကို real (live) DOM မှာ အဆင်သင့်ဖြစ်နေပါပြီ။ အဆင်သင့်ဖြစ်သောအခါတွင် အပိုင်းအစကို သင်ထည့်သွင်းသောကြောင့်၊ ပြန်လည်စီးဆင်းမှုတစ်ခုနှင့် တစ်ခုတည်းသော render တစ်ခုသာရှိပါမည်။
အကွက်များတွင် HTML အစိတ်အပိုင်းများကို ထပ်ဖြည့်လိုပါက၊ document fragments များကို အသုံးပြုခြင်းဖြင့် စွမ်းဆောင်ရည်ကို မြှင့်တင်ပေးပါသည်။
သတိပေးချက်
စာရွက်စာတမ်းအပိုင်းအစတွင် ထည့်သွင်းထားသော စာရွက်စာတမ်း ဆုံမှတ်များကို မူရင်းစာရွက်စာတမ်းမှ ဖယ်ရှားသည်။
အထားအသို
document.createDocumentFragment()
ကန့်သတ်ချက်များ
မရှိပါ။ |
တန်ဖိုးကို ပြန်ပေးသည်။
ရိုက်ပါ။ | ဖော်ပြချက် |
Node | ဖန်တီးထားသော DocumentFragment node |
Browser ပံ့ပိုးမှု
document.createComment()
DOM Level 1 (1998) အင်္ဂါရပ်တစ်ခုဖြစ်သည်။
ဘရောက်ဆာအားလုံးတွင် ၎င်းကို အပြည့်အဝထောက်ခံသည်-
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | 9-11 | Yes | Yes | Yes | Yes |