Методи cloneNode

Методи cloneNode имкон медиҳад, ки элементро клон карда ва нусхаи дақиқи онро гиред. Ин нусхаро сипас бо ёрии методҳои prepend, append, appendChild, insertBefore ё insertAdjacentElement ба саҳифа гузоред.

Дар параметр метод true ё false мегирад. Агар true дода шавад, элемент комилан клон карда мешавад, ҳамроҳ бо ҳама атрибутҳо ва элементҳои фарзандӣ, ва агар false дода шавад - танҳо худи элемент (бе элементҳои фарзандӣ).

Синтаксис

элемент.cloneNode(true ё false);

Мисол

Нусхае аз блок бо синфи elem месозем ва онро ба охири блоки #parent мегузорем:

<div id="parent">
	<div class="elem">
		<p>матн1</p>
		<p>матн2</p>
	</div>
</div>

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

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

Натиҷаи иҷрои рамз:

<div id="parent">
	<div class="elem">
		<p>матн1</p>
		<p>матн2</p>
	</div>
	<div class="elem">
		<p>матн1</p>
		<p>матн2</p>
	</div>
</div>

Мисол

Бо клони гирифташуда метавон чун элементи оддӣ кор кард:

<div id="parent">
	<div class="elem">
		<p>матн1</p>
		<p>матн2</p>
	</div>
</div>

let 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);

Натиҷаи иҷрои рамз:

<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,
ки бо ёрии он метавон элементи нав сохт