/
index.md
123 lines (88 loc) · 2.78 KB
/
index.md
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
---
title: "Node: Método removeChild()"
short-title: removeChild()
slug: Web/API/Node/removeChild
l10n:
sourceCommit: 56c76424a5edb45f6716ac4ee48861dac8e7ae38
---
{{APIRef("DOM")}}
El método **`removeChild()`** de la interfaz {{domxref("Node")}} elimina un nodo hijo del DOM y devuelve el nodo eliminado.
> **Nota:** Mientras se mantenga una referencia sobre el elemento hijo eliminado, seguirá existiendo en la memoria, pero ya no forma parte del DOM. Todavía se puede reutilizar más adelante en el código.
>
> Si el valor devuelto de `removeChild()` no se almacena y no se guarda ninguna otra referencia, se [eliminará automáticamente](/es/docs/Web/JavaScript/Memory_management) de la memoria al cabo de un breve tiempo.
A diferencia de {{domxref("Node.cloneNode()")}}, el valor devuelto conserva los objetos `EventListener` asociados con él.
## Sintaxis
```js-nolint
removeChild(child)
```
### Parámetros
- `child`
- : Un {{domxref("Node")}} que es el nodo hijo que se eliminará del DOM.
### Excepción
- `NotFoundError` {{domxref("DOMException")}}
- : Se lanza si `child` no es un hijo del nodo.
- {{jsxref("TypeError")}}
- : Se lanza si `child` es `null`.
## Ejemplos
### Ejemplos simples
Dado este HTML:
```html
<div id="parent">
<div id="child"></div>
</div>
```
Para eliminar un elemento específico cuando se conoce su nodo principal:
```js
const parent = document.getElementById("parent");
const child = document.getElementById("child");
const throwawayNode = parent.removeChild(child);
```
Para eliminar un elemento específico sin tener que especificar su nodo principal:
```js
const node = document.getElementById("child");
if (node.parentNode) {
node.parentNode.removeChild(node);
}
```
Para eliminar todos los hijos de un elemento:
```js
const element = document.getElementById("idOfParent");
while (element.firstChild) {
element.removeChild(element.firstChild);
}
```
### Causar un TypeError
```html
<!--Código HTML de muestra-->
<div id="parent"></div>
```
```js
const parent = document.getElementById("parent");
const child = document.getElementById("child");
// Arroja Uncaught TypeError
const garbage = parent.removeChild(child);
```
### Causar un NotFoundError
```html
<!--Código HTML de muestra-->
<div id="parent">
<div id="child"></div>
</div>
```
```js
const parent = document.getElementById("parent");
const child = document.getElementById("child");
// Esta primera llamada elimina correctamente el nodo.
const garbage = parent.removeChild(child);
// Arroja NotFoundError
garbage = parent.removeChild(child);
```
## Especificaciones
{{Specifications}}
## Compatibilidad con navegadores
{{Compat}}
## Véase también
- {{domxref("Node.replaceChild()")}}
- {{domxref("Node.parentNode")}}
- {{domxref("Element.remove()")}}
- {{domxref("Node.cloneNode()")}}