Метод removeChild()
Пример
Удалить первый элемент <li> из списка:
var list = document.getElementById("myList"); // Получите элемент <ul> с id="myList"
list.removeChild(list.childNodes[0]); // удалить первый дочерний узел <ul> (индекс 0)
Перед удалением:
- Кофе
- Чай
- Молоко
После удаления:
- Чай
- Молоко
Попробуйте сами »
Дополнительные примеры "Попробуй сам" приведены ниже.
Определение и использование
Метод removeChild() удаляет указанный дочерний узел указанного элемента.
Возвращает удаленный узел как узел объекта или null, если узел не существует.
Примечание: Удаленный дочерний узел больше не является частью DOM. Однако с помощью ссылки, возвращаемой этим методом, можно вставить удаленный дочерний элемент в более позднее время (см. "Ещё примеры").
Совет: Используйте метод appendChild() или insertBefore() для вставки удаленного узела в тот же документ. Чтобы вставить его в другой документ, используйте метод document.adoptNode() или document.importNode().
Поддержка браузера
Метод | |||||
---|---|---|---|---|---|
removeChild() | Да | Да | Да | Да | Да |
Синтаксис
node.removeChild(node)
Параметр значений
Параметр | Тип | Описание |
---|---|---|
node | Объект node | Требуемый. Узел объект, который вы хотите удалить |
Технические детали
Вернёт значение | Объект узел, представляющий удаленный узел, или null, если узел не существует |
---|---|
DOM Версия | Базового уровня 1 Объект узел |
Ещё примеры
Пример
Узнайте, есть ли в списке какие-либо дочерние узлы. Если это так, удалите его первый дочерний узел (индекс 0):
// Получите элемент <ul> с id="myList"
var list = document.getElementById("myList");
// Если элемент <ul> имеет какие-либо дочерние узлы, удалите его первый дочерний узел
if (list.hasChildNodes()) {
list.removeChild(list.childNodes[0]);
}
Перед удалением:
- Кофе
- Чай
- Молоко
После удаления:
- Чай
- Молоко
Попробуйте сами »
Пример
Удалить все дочерние узлы списка:
// Получите элемент <ul> с id="myList"
var list = document.getElementById("myList");
// Пока <ul> имеет дочерний узел, удалите его
while (list.hasChildNodes()) {
list.removeChild(list.firstChild);
}
Перед удалением:
- Кофе
- Чай
- Молоко
После удаления:
Попробуйте сами »
Пример
Удалить элемент <li> с id="multi" из его родительского элемента (без указания его родительского узла):
var item = document.getElementById("myLI");
item.parentNode.removeChild(item);
Перед удалением:
- Кофе
- Чай
- Молоко
После удаления:
- Кофе
- Молоко
Попробуйте сами »
Пример
Удалите элемент <li> из его родительского элемента и вставьте его снова:
var item = document.getElementById("myLI");
function removeLi() {
item.parentNode.removeChild(item);
}
function appendLi() {
var list = document.getElementById("myList");
list.appendChild(item);
}
Попробуйте сами »
Пример
Удалить элемент <span> из его родительского элемента и вставьте его в элемент <h1> в другом документе:
var child = document.getElementById("mySpan");
function removeLi() {
child.parentNode.removeChild(child);
}
function myFunction() {
var frame = document.getElementsByTagName("IFRAME")[0]
var h = frame.contentWindow.document.getElementsByTagName("H1")[0];
var x = document.adoptNode(child);
h.appendChild(x);
}
Попробуйте сами »