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(); // сілтеме бойынша өтуді болдырмау
});

Өздігіңізше, менің кодымға қарамастан, сипатталған мәселені шешіңіз.