Skakel om element op JavaScript te verwyder

Laat ons sê ons het 'n paragraaf. Laat ons langs dit 'n skakel maak waarmee hierdie paragraaf verwyder kan word.

Laat ons implementeer:

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

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

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

Let op dat die href-kenmerk van die skakel # bevat. As hierdie hekjel weggelaat word - ontvang ons 'n oorgang na die skakel en, as gevolg, die bladsy sal verfris.

Eintlik sal die verwydering van die paragraaf ook plaasvind, maar ons sal dit nie sien nie, aangesien die bladsy verfris en alles sal terugkeer na die oorspronklike posisie.

Om die probleem op te los, moet die oorgang na die skakel verhinder word met behulp van preventDefault:

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

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

remove.addEventListener('click', function(event) {
	elem.remove();
	event.preventDefault(); // kanselleer die oorgang na die skakel
});

Los die beskryfde probleem self op, sonder om na my kode te kyk.