Метод HTML DOM removeChild()
Пример
Удалите первый элемент <li> из списка:
var list = document.getElementById("myList"); // Get the <ul> element with id="myList"
list.removeChild(list.childNodes[0]); // Remove <ul>'s first child node (index 0)
Перед удалением:
- Кофе
- Чай
- Молоко
После удаления:
- Чай
- Молоко
Другие примеры «Попробуйте сами» ниже.
Определение и использование
Метод removeChild() удаляет указанный дочерний узел указанного элемента.
Возвращает удаленный узел как объект Node или null , если узел не существует.
Примечание . Удаленный дочерний узел больше не является частью DOM. Однако со ссылкой, возвращаемой этим методом, можно вставить удаленный дочерний элемент в элемент позднее (см. «Дополнительные примеры»).
Совет: используйте метод appendChild() или insertBefore() , чтобы вставить удаленный узел в тот же документ. Чтобы вставить его в другой документ, используйте метод document.adoptNode() или document.importNode() .
Поддержка браузера
| Method | |||||
|---|---|---|---|---|---|
| removeChild() | Yes | Yes | Yes | Yes | Yes |
Синтаксис
node.removeChild(node)
Значения параметров
| Parameter | Type | Description |
|---|---|---|
| node | Node object | Required. The node object you want to remove |
Технические детали
| Возвращаемое значение: | Объект Node, представляющий удаленный узел, или null , если узел не существует. |
|---|---|
| DOM-версия | Базовый объект узла уровня 1 |
Дополнительные примеры
Пример
Узнайте, есть ли в списке дочерние узлы. Если это так, удалите его первый дочерний узел (индекс 0):
// Get the <ul> element with id="myList"
var list = document.getElementById("myList");
// If the <ul> element has any child nodes, remove its first child node
if (list.hasChildNodes()) {
list.removeChild(list.childNodes[0]);
}
Перед удалением:
- Coffee
- Tea
- Milk
После удаления:
- Tea
- Milk
Пример
Удалить все дочерние узлы списка:
// Get the <ul> element with id="myList"
var list = document.getElementById("myList");
// As long as <ul> has a child node, remove it
while (list.hasChildNodes()) {
list.removeChild(list.firstChild);
}
Перед удалением:
- Coffee
- Tea
- Milk
После удаления:
Пример
Удалите элемент <li> с id="myLI" из его родительского элемента (без указания его родительского узла):
var item = document.getElementById("myLI");
item.parentNode.removeChild(item);
Перед удалением:
- Coffee
- Tea
- Milk
После удаления:
- Coffee
- Milk
Пример
Удалите элемент <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);
}