Ташкили худкории элементҳои нав дар JavaScript

Дар дарси қаблӣ мо бо ҳам омӯхтем, ки чӣ тавр элементҳоро клик кардан бар худ нест мекунанд.

Бигзор ҳоло дар волидайн аз аввал элементҳо вуҷуд надошта бошанд:

<div id="parent"></div>

Биёед дар давр 9 абзасҳои нав эҷод кунем, ва ҳамзамон чунон кунем, ки ҳар як абзас бо клик кардан бар он нест шавад:

let parent = document.querySelector('#parent');

for (let i = 1; i <= 9; i++) {
	let p = document.createElement('p');
	p.textContent = i;
	
	p.addEventListener('click', function() {
		this.remove();
	});
	
	parent.appendChild(p);
}

Коди зерин дода шудааст:

<ul id="parent">
	<li>1</li>
	<li>2</li>
	<li>3</li>
</ul>

<input type="submit" id="button">

Чунон кунед, ки бо клик кардан ба тугма дар рӯйхат як элементи нав илова шавад. Чунон кунед, ки ҳар як li бо клик кардан бар он нест шавад. Ин маъноро дар бораи ҳамон li-ҳое, ки аллакай дар рӯйхат мавҷуданд, ва ҳам дар бораи навҳое, ки пас аз фишурдани тугма сохта мешаванд, дорад.