#javascript #jquery #html
#javascript #jquery #HTML
Вопрос:
Возможно ли удалить HTML-элемент из разметки напрямую с помощью Javascript / jQuery / Ajax вместо использования CSS display: none
?
Комментарии:
1. Просто немного педантично, но вы не совсем удаляете его из разметки — вы удаляете его из объектной модели документа. Разметка — это просто текст, передаваемый по проводам.
Ответ №1:
ДА
JavaScript
var parent = document.getElementById('parentElementID');
var child = document.getElementById('childElementID');
parent.removeChild(child);
jQuery
$('#parentElementID').remove('#childElementID');
Комментарии:
1. или еще проще
$('#childElementId').remove()
2. Согласен, хотел быть более описательным. Всегда предлагайте провести как можно больший рефакторинг.
3. или с помощью «ванильного» js и без необходимости «знать» родительский элемент
child.parentNode.removeChild(child)
4. Я знаю, что это было некоторое время назад, и теперь есть новый .remove() для Vanilla JS, который не работает в IE, поэтому remove .removeChild() — лучший кроссбраузерный. И я знаю, что в последнее время jQuery подвергается критике за то, что он недостаточно хорош или является помехой, но jQuery просто упрощает это. План и простота.
Ответ №2:
element.parentNode.removeChild(element)
Ответ №3:
Это старый вопрос, поэтому ответы несколько устарели. Раньше для удаления элемента вы получали родительский узел, элемент и использовали removeChild()
, как предлагали другие:
element.parentNode.removeChild(element);
Хотя это все еще вполне приемлемо, теперь вы можете удалить узел напрямую:
document.getElementById('elementId').remove();
document.getElementById('remove-button').addEventListener('click', function() {
document.getElementById('container').remove();
});
#container {
width:50px;
height:50px;
background-color:#bada55;
}
<div id="container"></div>
<button id="remove-button">Remove</button>
Комментарии:
1. Я знаю, что это было некоторое время назад, и теперь есть новый .remove() для Vanilla JS, и я согласен с этим ответом и проголосовал за него, и это не работает в IE, поэтому .removeChild () — лучший кроссбраузерный, если вы по той или иной причине все еще поддерживаете IE. И я знаю, что в последнее время jQuery подвергается критике за то, что он недостаточно хорош или является помехой, но jQuery просто упрощает кроссбраузерную поддержку. Спасибо за обновление ответа тоже.
Ответ №4:
ДА. Вы могли бы использовать jQuery remove() API.
Ответ №5:
собственный javascript:
var toremove = document.getElementById('hd');
toremove.parentNode.removeChild(toremove);
Или в jquery просто используйте
$('#toremove').remove();