Дар JavaScript барои нест кардани элемент пайванд

Бигзор мо як абзас дошта бошем. Биёед дар паҳлӯи он пайванде созем, ки бо ёрии он ин абзасро дарвоқеъ нест кардан мумкин аст.

Амалӣ мекунем:

<div id="parent">
	<p id="elem">матн</p>
	<a href="#" id="remove">нест кардан</a>
</div>

let elem   = document.querySelector('#elem');
let remove = document.querySelector('#remove');

remove.addEventListener('click', function() {
	elem.remove();
});

Ба ин диққат диҳед, ки дар сифати href-и пайванд # истодааст. Агар ин аломати #-ро тоза кунем - мо ба пайванд гузашта, натиҷа саҳифаро навсозӣ мекунем.

Дар воқеъ, нест шудани абзас низ рӯй хоҳад дод, аммо мо инро надида мегирем, зеро саҳифа нав мешавад ва ҳама чиз ба вазъияти аввала бармегардад.

Барои ҳалли мушкилот бояд гузариш аз пайвандро бо ёрии preventDefault пешгирӣ кард:

<div id="parent">
	<p id="elem">матн</p>
	<a href="" id="remove">нест кардан</a>
</div>

let elem   = document.querySelector('#elem');
let remove = document.querySelector('#remove');

remove.addEventListener('click', function(event) {
	elem.remove();
	event.preventDefault(); // гузариш аз пайвандро бекор мекунем
});

Худкор, ба коди ман нанигаред, масъалаи дар боло тавсифшударо ҳал кунед.