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

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

Mysal

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

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

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

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

Kodyň ýerine ýetiriliş netijesi:

<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:

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

let 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:

<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ň

createElement metodi,
onyň ýardymy bilen täze element döredip bolýar