cloneNode Method

cloneNode method သည် element တစ်ခုကို ပုံတူကူးပြီး ၎င်း၏ တိကျသော ပုံစံတူကို ရယူနိုင်စေပါသည်။ ထိုပုံတူကို ထို့နောက် prepend, append, appendChild, insertBefore သို့မဟုတ် insertAdjacentElement စသော method များကို အသုံးပြု၍ စာမျက်နှာပေါ်သို့ ထည့်သွင်းနိုင်ပါသည်။

ပါရာမီတာအနေဖြင့် ဤ method သည် true သို့မဟုတ် false ကို လက်ခံပါသည်။ true ကို ပေးလိုက်ပါက element ကို ၎င်း၏ attribute များနှင့် သားစဉ်မြေးဆက်အားလုံးနှင့်အတူ အပြည့်အစုံ ပုံတူကူးပါမည်။ false ကို ပေးလိုက်ပါက element ကိုသာ (သားစဉ်မြေးဆက်များ မပါဘဲ) ပုံတူကူးပါမည်။

Syntax

javascriptelement.cloneNode(true သို့မဟုတ် false);

ဥပမာ

elem class ပါသော block ၏ ပုံတူတစ်ခုကို ဖန်တီးပြီး #parent block ၏ နောက်ဆုံးတွင် ထည့်သွင်းကြည့်ပါမည်။

html<div id="parent">
  <div class="elem">
    <p>စာသား1</p>
    <p>စာသား2</p>
  </div>
</div>
javascriptlet parent = document.getElementById('parent');
let elem = parent.querySelector('.elem');

let clone = elem.cloneNode(true);
parent.appendChild(clone);

ကုဒ်ကို run ပြီးသောအခါ ရလဒ်။

html<div id="parent">
  <div class="elem">
    <p>စာသား1</p>
    <p>စာသား2</p>
  </div>
  <div class="elem">
    <p>စာသား1</p>
    <p>စာသား2</p>
  </div>
</div>

ဥပမာ

ရရှိလာသော ပုံတူ clone ဖြင့် သာမန် element တစ်ခုကဲ့သို့ အလုပ်လုပ်နိုင်ပါသည်။

html<div id="parent">
  <div class="elem">
    <p>စာသား1</p>
    <p>စာသား2</p>
  </div>
</div>
javascriptlet parent = document.getElementById('parent');
let elem = parent.querySelector('.elem');

let clone = elem.cloneNode(true);
clone.children[0].textContent = 'စာသားအသစ်1';
clone.children[1].textContent = 'စာသားအသစ်2';

parent.appendChild(clone);

ကုဒ်ကို run ပြီးသောအခါ ရလဒ်။

html<div id="parent">
  <div class="elem">
    <p>စာသား1</p>
    <p>စာသား2</p>
  </div>
  <div class="elem">
    <p>စာသားအသစ်1</p>
    <p>စာသားအသစ်2</p>
  </div>
</div>

အခြားကြည့်ရှုရန်

  • createElement method,
    အသစ်သော element များ ဖန်တီးရန် အသုံးပြုနိုင်သည်