JavaScript-de element aýyrmak üçin baglanyşyk

Bizde bir abzas bolsun. Onuň ýanynda, bu abzasy aýyryp boljak baglanyşyk edeliň.

Amala aşyryň:

<div id="parent">
	<p id="elem">text</p>
	<a href="#" id="remove">remove</a>
</div>

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

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

Baglanyşygyň href atributynda # belgisi bar bolandygyna üns beriň. Eger bu reşetkany aýyrsak - biz baglanyşyk boýunça geçiş we netijede, sahypanyň täzelenmegini alarys.

Aslynda, abzasyň aýyrylmagy hem boljak, ýöne biz ony sezmäris, sebäbi sahypa täzelenjek we hemmesi başlangyç ýagdaýyna gaýdyp geljek.

Bu meseleni çözmek üçin preventDefault ulanmak bilen baglanyşyk boýunça geçişiň öňüni almaly:

<div id="parent">
	<p id="elem">text</p>
	<a href="" id="remove">remove</a>
</div>

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

remove.addEventListener('click', function(event) {
	elem.remove();
	event.preventDefault(); // baglanyşyk boýunça geçişi ýatyrýarys
});

Özbaşyna, meniň koduma seretmezden, beýan edilen meseläni çözüň.