HTML-DOM - Methode removeChild()
Beispiel
Entfernen Sie das erste <li>-Element aus einer Liste:
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)
Vor dem Entfernen:
- Kaffee
- Tee
- Milch
Nach dem Entfernen:
- Tee
- Milch
Weitere „Probieren Sie es selbst“-Beispiele weiter unten.
Definition und Verwendung
Die Methode removeChild() entfernt einen angegebenen untergeordneten Knoten des angegebenen Elements.
Gibt den entfernten Knoten als Node-Objekt oder null zurück, wenn der Knoten nicht vorhanden ist.
Hinweis: Der entfernte untergeordnete Knoten ist nicht mehr Teil des DOM. Mit der von dieser Methode zurückgegebenen Referenz ist es jedoch möglich, das entfernte untergeordnete Element zu einem späteren Zeitpunkt in ein Element einzufügen (siehe "Weitere Beispiele").
Tipp: Verwenden Sie die Methode appendChild() oder insertBefore() , um den entfernten Knoten in dasselbe Dokument einzufügen. Verwenden Sie zum Einfügen in ein anderes Dokument die Methode document.adoptNode() oder document.importNode() .
Browser-Unterstützung
| Method | |||||
|---|---|---|---|---|---|
| removeChild() | Yes | Yes | Yes | Yes | Yes |
Syntax
node.removeChild(node)
Parameterwerte
| Parameter | Type | Description |
|---|---|---|
| node | Node object | Required. The node object you want to remove |
Technische Details
| Rückgabewert: | Ein Node-Objekt, das den entfernten Knoten darstellt, oder null , wenn der Knoten nicht vorhanden ist |
|---|---|
| DOM-Version | Knotenobjekt der Kernebene 1 |
Mehr Beispiele
Beispiel
Finden Sie heraus, ob eine Liste untergeordnete Knoten hat. Wenn dies der Fall ist, entfernen Sie den ersten untergeordneten Knoten (Index 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]);
}
Vor dem Entfernen:
- Coffee
- Tea
- Milk
Nach dem Entfernen:
- Tea
- Milk
Beispiel
Entfernen Sie alle untergeordneten Knoten einer Liste:
// 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);
}
Vor dem Entfernen:
- Coffee
- Tea
- Milk
Nach dem Entfernen:
Beispiel
Entfernen Sie ein <li>-Element mit id="myLI" von seinem übergeordneten Element (ohne seinen übergeordneten Knoten anzugeben):
var item = document.getElementById("myLI");
item.parentNode.removeChild(item);
Vor dem Entfernen:
- Coffee
- Tea
- Milk
Nach dem Entfernen:
- Coffee
- Milk
Beispiel
Entfernen Sie ein <li>-Element von seinem übergeordneten Element und fügen Sie es erneut ein:
var item = document.getElementById("myLI");
function removeLi() {
item.parentNode.removeChild(item);
}
function appendLi() {
var list = document.getElementById("myList");
list.appendChild(item);
}
Beispiel
Entfernen Sie ein <span>-Element von seinem übergeordneten Element und fügen Sie es in ein <h1>-Element in einem anderen Dokument ein:
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);
}