HTML DOM removeChild() methode
Voorbeeld
Verwijder het eerste <li> element uit een lijst:
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)
Voor het verwijderen:
- Koffie
- Thee
- Melk
Na het verwijderen:
- Thee
- Melk
Meer "Probeer het zelf" voorbeelden hieronder.
Definitie en gebruik
De methode removeChild() verwijdert een opgegeven onderliggend knooppunt van het opgegeven element.
Retourneert het verwijderde knooppunt als een knooppuntobject, of null als het knooppunt niet bestaat.
Opmerking: het verwijderde onderliggende knooppunt maakt geen deel meer uit van de DOM. Met de verwijzing die door deze methode wordt geretourneerd, is het echter mogelijk om het verwijderde kind op een later tijdstip in een element in te voegen (zie "Meer voorbeelden").
Tip: Gebruik de methode appendChild() of insertBefore() om het verwijderde knooppunt in hetzelfde document in te voegen. Gebruik de methode document.adoptNode() of document.importNode() om het in een ander document in te voegen .
Browserondersteuning
| Method | |||||
|---|---|---|---|---|---|
| removeChild() | Yes | Yes | Yes | Yes | Yes |
Syntaxis
node.removeChild(node)
Parameterwaarden
| Parameter | Type | Description |
|---|---|---|
| node | Node object | Required. The node object you want to remove |
Technische details
| Winstwaarde: | Een knooppuntobject, dat het verwijderde knooppunt vertegenwoordigt, of null als het knooppunt niet bestaat |
|---|---|
| DOM-versie | Kernniveau 1 knooppuntobject |
Meer voorbeelden
Voorbeeld
Zoek uit of een lijst onderliggende knooppunten heeft. Als dit het geval is, verwijder dan het eerste onderliggende knooppunt (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]);
}
Voor het verwijderen:
- Coffee
- Tea
- Milk
Na het verwijderen:
- Tea
- Milk
Voorbeeld
Verwijder alle onderliggende knooppunten van een lijst:
// 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);
}
Voor het verwijderen:
- Coffee
- Tea
- Milk
Na het verwijderen:
Voorbeeld
Verwijder een <li> element met id="myLI" uit het bovenliggende element (zonder het bovenliggende knooppunt op te geven):
var item = document.getElementById("myLI");
item.parentNode.removeChild(item);
Voor het verwijderen:
- Coffee
- Tea
- Milk
Na het verwijderen:
- Coffee
- Milk
Voorbeeld
Verwijder een <li>-element uit zijn bovenliggende element en voeg het opnieuw in:
var item = document.getElementById("myLI");
function removeLi() {
item.parentNode.removeChild(item);
}
function appendLi() {
var list = document.getElementById("myList");
list.appendChild(item);
}
Voorbeeld
Verwijder een <span>-element van het bovenliggende element en voeg het in aan een <h1>-element in een ander document:
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);
}