Удалить элемент по идентификатору

Я знаю, что приумножение собственных функций дом это'т всегда лучшая или наиболее популярное решение, но это отлично работает в современных браузерах.

Element.prototype.remove = function() {
    this.parentElement.removeChild(this);
}
NodeList.prototype.remove = HTMLCollection.prototype.remove = function() {
    for(var i = this.length - 1; i >= 0; i--) {
        if(this[i] && this[i].parentElement) {
            this[i].parentElement.removeChild(this[i]);
        }
    }
}

И затем вы можете удалить элементы, такие как этот

document.getElementById("my-element").remove();

или

document.getElementsByClassName("my-elements").remove();

Примечание: это решение не't работа для IE 7 и ниже. Для получения дополнительной информации о продлении дом читать настоящей статье.

Редактировать: обзор моего ответа в 2019, узел.удалить() пришел на помощь и может быть использовано следующим образом (без полифилл выше):

document.getElementById("my-element").remove();

или

[...document.getElementsByClassName("my-elements")].map(n => n && n.remove());

Эти функции доступны во всех современных браузерах (не IE). Подробнее о МДН.

Crossbrowser и т. е. >= 11:

document.getElementById("element-id").outerHTML = "";

Вы можете сделать функцию remove, чтобы не думать об этом каждый раз:

function removeElement(id) {
    var elem = document.getElementById(id);
    return elem.parentNode.removeChild(elem);
}

Это то, что поддерживает DOM. Поищите на этой странице "remove" или "delete", и removeChild - единственный, который удаляет узел.

В дом организован в виде дерева узлов, где каждый узел имеет значение, а также список ссылок на дочерние узлы. Так что `элемент.parentNode.метода removechild(элементу) имитирует именно то, что происходит внутри страны: сначала вы идете в родительский узел, а затем удалить ссылку на дочерний узел.

Как из DOM4, вспомогательная функция предусмотрена, чтобы сделать то же самое: элемент.удалить(). Это сочинение в 87% браузеров]1 (в 2016 году), но не <сокр название="в Интернет Эксплорер 11" и>Т. е. 11</сокр>. Если вам нужно поддерживать старые браузеры, вы можете:

• Удалить элементы через родительский узел, а в question](https://www.google.com/search?q=What%20is%20the%20answer%20to%20the%20ultimate%20question%20of%20life,%20the%20universe,%20and%20everything%3F),
• модифицировать встроенные функции DOM, как и в далеко не соответствует имеющемуся потенциалу Йохан'ы ответ, или
• использовать DOM4 полифилл.

Для удаления одного элемента:

 var elem = document.getElementById("yourid");
 elem.parentElement.removeChild(elem);

Для удаления всех элементов с определенным именем класса:

 var list = document.getElementsByClassName("yourclassname");
 for(var i = list.length - 1; 0 

вы можете просто использовать элемент.удалить()

В ChildNode.удаление (метод) удаляет объект из древа, которой он принадлежит.

https://developer.mozilla.org/en-US/docs/Web/API/ChildNode/remove

Вот скрипку, которая показывает, как вы можете называть документ.метода getElementById('мой-ИД').удалить()`

https://jsfiddle.net/52kp584L/

**

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

**

для того чтобы зайти на родительский узел, сначала кажется немного странным для меня, почему JavaScript работает, как это?

Функция называется метода removechild()`, и как это возможно, чтобы удалить ребенка, когда там's нет родителей? :)

С другой стороны, вам не всегда придется назвать его, как вы показали. элемента.parentNode-это только помощник, чтобы получить родительский узел данного узла. Если вы уже знаете Родительском узле, вы можете просто использовать его как это:

Экс:

// Removing a specified element when knowing its parent node
var d = document.getElementById("top");
var d_nested = document.getElementById("nested");
var throwawayNode = d.removeChild(d_nested);

https://developer.mozilla.org/en-US/docs/Web/API/Node/removeChild

=========================================================

Чтобы добавить что-то еще:

Некоторые ответы указывали на то, что вместо того, чтобы использовать parentNode.метода removechild(ребенка); можно использовать Элем.удалить();. Но как я заметил, Есть разница между этими двумя функциями, и это's не упомянули в эти ответы.

Если вы используете `метода removechild (), она возвращает ссылку на удаленный узел.

var removedChild = element.parentNode.removeChild(element); 
console.log(removedChild); //will print the removed child.

Но если вы используете Элема.удалить();, он выиграл'т вернуть вам ссылку.

var el = document.getElementById('Example');
var removedChild = el.remove(); //undefined

https://developer.mozilla.org/en-US/docs/Web/API/ChildNode/remove

Такое поведение наблюдается в Хроме и ФФ. Я верю, что это's стоит замечать :)

Надеюсь, что мой ответ добавляет некоторое значение к вопросу и будет полезен!!

Функции, которые используют эле.parentNode.метода removechild(эле) выиграл't работа для элементы, которые вы'вэ, созданных, но еще не вставлен в HTML. Библиотеки, такие как jQuery и Prototype грамотно использовать метод вроде следующего, чтобы избежать этого ограничения.

_limbo = document.createElement('div');
function deleteElement(ele){
    _limbo.appendChild(ele);
    _limbo.removeChild(ele);
}

Я думаю, что JavaScript работает, как, что, поскольку дом'ы оригинальный конструкторов родителя/ребенка и предыдущей/следующей навигации, так как более высокий приоритет, чем для DHTML изменений, которые так популярны сегодня. Умея читать с одного &ЛТ;входной тип='текст'> и писать в другой по относительному местоположению на дом является полезным в середине 90-х годов, время, когда динамическая генерация весь HTML-формы или интерактивные элементы интерфейса, едва огоньком в некоторых разработчика'ы глаз.

По данным дом 4 уровня спецификации, которая является текущая версия в разработке, есть некоторые новые удобные мутация методов: добавить(), добавить(), до(), после(), заменить () и удалить().

https://catalin.red/removing-an-element-with-plain-javascript-remove-method/

Вы можете напрямую снять этот элемент с помощью метода remove()` дом.

здесь'ы пример:

let subsWrapper = document.getElementById("element_id");
subsWrapper.remove();
//OR directly.
document.getElementById("element_id").remove();

для того чтобы зайти на родительский узел, сначала кажется немного странным для меня, есть причина JavaScript работает, как это?

ИМХО: причина этого такая же, как я'вэ видел в других средах: вы выполняете действие, основанный на вашу "ссылка" на что-то. Вы можете'т удалить его, пока вы'вновь связаны с ним.

Как резать ветку дерева. Сидеть на стороне, ближайшей к дереву при резке или результат будет ... жаль (хотя смешно).

Это на самом деле исходит от Firefox... за один раз, т. е. был впереди и допускается удаление элемента непосредственно.

Это только мое предположение, но я считаю, что причина, что вы должны удалить ребенка через родителей происходит из-за проблемы с тем, как Firefox и обрабатываются ссылки.

Если вы называете объект для совершения Хари-Кари напрямую, то сразу после того, как он умирает, вы все еще держите ссылку на него. Это имеет потенциал, чтобы создать несколько неприятных ошибок... например, не удалить его, удалив ее, но сохраняя ссылки на него, которые появляются действительными, или просто утечка памяти.

Я считаю, что когда они поняли проблему, обойти было удалить элемент через его родителей, потому что, когда элемент пропал, ты теперь просто хранит ссылку на родителя. Это позволило бы прекратить все эти неприятности, и (если закрыть узел дерева, узел, к примеру) бы 'молнии' а приятно.

Это должно быть легко исправить ошибку, но как и во многом другом в веб-программировании, релиз был, вероятно, бросился, ведущих к этому... а к тому времени появится новая версия ПО, достаточно много людей использовали его, что изменение это приведет к нарушению кучу кода.

Опять же, все это просто мои догадки.

Но я с нетерпением жду того дня, когда веб-программирования, наконец, получает полный генеральную уборку, все эти странные маленькие idiosynchracies привести себя в порядок, и все начинают играть по тем же правилам.

Вероятно, на следующий день после моего слугу, робот подаст на меня в суд за долги по зарплате.

Насколько я понимаю, удаление узла напрямую не работает в Firefox, только в Internet Explorer. Поэтому для поддержки Firefox вам нужно подняться до родительского узла, чтобы удалить его дочерний узел.

Ссылка: http://chiragrdarji.wordpress.com/2007/03/16/removedelete-element-from-page-using-javascript-working-in-firefoxieopera/

Это лучшая функция для удаления элемента без ошибок скрипта:

function Remove(EId)
{
    return(EObj=document.getElementById(EId))?EObj.parentNode.removeChild(EObj):false;
}

Примечание к EObj=документ.метода getElementById(ИД)`.

Это один знак равенства не ==.

если элемент ИД существует функция удаляет его, в противном случае она возвращает значение false, а не "ошибка".