Как удалить элемент html через js
Удалить элемент из html достаточно просто.
Нужно воспользоваться методом document.querySelector()
и найти нужный элемент по селектору.
Далее вызвать у родителя нужного элемента метод removeChild()
, передав ему элемент.
Пример ниже:
const h1 = document.querySelector('h1')
const parent = h1.parentNode
parent.removeChild(h1)
// элемента больше нет внутри DOM дерева страницы
Чтобы удалить элемент HTML через JavaScript, можно использовать метод remove()
или removeChild()
:
const element = document.getElementById('myElement');
element.remove();
Метод remove()
удаляет элемент напрямую. Однако, он не поддерживается в очень старых браузерах.
Как альтернативный способ мы можем использовать removeChild()
:
const element = document.getElementById('myElement');
element.parentNode.removeChild(element);
Здесь мы сначала получаем родителский элемент, а затем удаляем из него наш целевой элемент.
Также, если вы работаете с динамичски созданными элементами, проверяйте их существование перед удалением. Так можно избежать ошибок, если элемент еще не создан или уже был удален.
const element = document.getElementById('myElement');
if (element) {
element.remove();
}