offline version v3
Запись на курсы по HTML, CSS, JavaScript, PHP, фреймворкам и CMS,
а также: помощь в поиске работы и заказов, стажировка на реальных проектах→
⊗jsPmPrRL 473 of 503 menu

Ссылка на удаление элемента на JavaScript

Пусть у нас абзац. Давайте рядом с ним сделаем ссылку, с помощью которой этот абзац можно будет удалить.

Реализуем:

<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(); });

Обратите внимание на то, что в атрибуте href ссылки стоит #. Если эту решетку убрать - мы получим переход по ссылке и, как следствие, обновление страницы.

На самом деле удаление абзаца тоже будет происходить, но мы это не заметим, так как страница обновится и все вернется в изначальное положение.

Для решения проблемы нужно предотвратить переход по ссылке с помощью preventDefault:

<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(); // отменяем переход по ссылке });

Самостоятельно, не подсматривая в мой код, решите описанную задачу.

enru