cloneNode metodi

cloneNode metodi elementleri klonlap, olaryň takyk göçürmesini almaga mümkinçilik berýär. Bu göçürmäni soňra sahypa üstüne prepend, append, appendChild, insertBefore ýa-da insertAdjacentElement metodlary ýardymy bilen goşup bolýar.

Metod parametr hökmünde true ýa-da false alyp biler. Eger true berilse, element ähli atributlary we çenli elementleri bilen doly klonlanýar. Eger false berilse, diňe element özi (çenli elementlerisiz) klonlanýar.

Sintaksis

javascriptelement.cloneNode(true ýa-da false);

Mysal

elem klasly blokunyň göçürmesini düzeliň we ony #parent blokunyň ahyryna goşalyň:

html<div id="parent">
  <div class="elem">
    <p>tekst1</p>
    <p>tekst2</p>
  </div>
</div>

javascriptlet parent = document.getElementById('parent');
let elem = parent.querySelector('.elem');

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

Kodyň ýerine ýetiriliş netijesi:

html<div id="parent">
  <div class="elem">
    <p>tekst1</p>
    <p>tekst2</p>
  </div>
  <div class="elem">
    <p>tekst1</p>
    <p>tekst2</p>
  </div>
</div>

Mysal

Alynan klon bilen adaty element ýaly işlemek mümkin:

html<div id="parent">
  <div class="elem">
    <p>tekst1</p>
    <p>tekst2</p>
  </div>
</div>

javascriptlet parent = document.getElementById('parent');
let elem = parent.querySelector('.elem');

let clone = elem.cloneNode(true);
clone.children[0].textContent = 'täze tekst1';
clone.children[1].textContent = 'täze tekst2';

parent.appendChild(clone);

Kodyň ýerine ýetiriliş netijesi:

html<div id="parent">
  <div class="elem">
    <p>tekst1</p>
    <p>tekst2</p>
  </div>
  <div class="elem">
    <p>täze tekst1</p>
    <p>täze tekst2</p>
  </div>
</div>

Şeýle-de garaşyň