Método HTML DOM removeChild()
Exemplo
Remova o primeiro elemento <li> de uma lista:
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)
Antes de remover:
- Café
- Chá
- Leite
Após remover:
- Chá
- Leite
Mais exemplos de "Experimente você mesmo" abaixo.
Definição e uso
O método removeChild() remove um nó filho especificado do elemento especificado.
Retorna o nó removido como um objeto Node ou null se o nó não existir.
Observação: o nó filho removido não faz mais parte do DOM. No entanto, com a referência retornada por esse método, é possível inserir o filho removido em um elemento posteriormente (consulte "Mais exemplos").
Dica: Use o método appendChild() ou insertBefore() para inserir o nó removido no mesmo documento. Para inseri-lo em outro documento, use o método document.adoptNode() ou document.importNode() .
Suporte ao navegador
| Method | |||||
|---|---|---|---|---|---|
| removeChild() | Yes | Yes | Yes | Yes | Yes |
Sintaxe
node.removeChild(node)
Valores de parâmetro
| Parameter | Type | Description |
|---|---|---|
| node | Node object | Required. The node object you want to remove |
Detalhes técnicos
| Valor de retorno: | Um objeto Node, representando o nó removido, ou null se o nó não existir |
|---|---|
| Versão DOM | Objeto de nó de nível 1 principal |
Mais exemplos
Exemplo
Descubra se uma lista tem nós filhos. Em caso afirmativo, remova seu primeiro nó filho (índice 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]);
}
Antes de remover:
- Coffee
- Tea
- Milk
Após remover:
- Tea
- Milk
Exemplo
Remova todos os nós filhos de uma lista:
// 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);
}
Antes de remover:
- Coffee
- Tea
- Milk
Após remover:
Exemplo
Remova um elemento <li> com id="myLI" de seu elemento pai (sem especificar seu nó pai):
var item = document.getElementById("myLI");
item.parentNode.removeChild(item);
Antes de remover:
- Coffee
- Tea
- Milk
Após remover:
- Coffee
- Milk
Exemplo
Remova um elemento <li> de seu pai e insira-o novamente:
var item = document.getElementById("myLI");
function removeLi() {
item.parentNode.removeChild(item);
}
function appendLi() {
var list = document.getElementById("myList");
list.appendChild(item);
}
Exemplo
Remova um elemento <span> de seu pai e insira-o em um elemento <h1> em outro documento:
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);
}