Metoda HTML DOM removeChild()
Przykład
Usuń pierwszy element <li> z listy:
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)
Przed wyjęciem:
- Kawa
- Herbata
- mleko
Po usunięciu:
- Herbata
- mleko
Więcej przykładów „Wypróbuj sam” poniżej.
Definicja i użycie
Metoda removeChild() usuwa określony węzeł podrzędny określonego elementu.
Zwraca usunięty węzeł jako obiekt Node lub null , jeśli węzeł nie istnieje.
Uwaga: usunięty węzeł podrzędny nie jest już częścią DOM. Jednak dzięki odwołaniu zwróconemu przez tę metodę można później wstawić usunięte dziecko do elementu (patrz „Więcej przykładów”).
Wskazówka: użyj metody appendChild() lub insertBefore() , aby wstawić usunięty węzeł do tego samego dokumentu. Aby wstawić go do innego dokumentu, użyj metody document.adoptNode() lub document.importNode() .
Obsługa przeglądarki
| Method | |||||
|---|---|---|---|---|---|
| removeChild() | Yes | Yes | Yes | Yes | Yes |
Składnia
node.removeChild(node)
Wartości parametrów
| Parameter | Type | Description |
|---|---|---|
| node | Node object | Required. The node object you want to remove |
Szczegóły techniczne
| Wartość zwrotu: | Obiekt Node, reprezentujący usunięty węzeł lub null , jeśli węzeł nie istnieje |
|---|---|
| Wersja DOM | Obiekt węzła poziomu podstawowego |
Więcej przykładów
Przykład
Dowiedz się, czy lista zawiera węzły podrzędne. Jeśli tak, usuń jego pierwszy węzeł podrzędny (indeks 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]);
}
Przed wyjęciem:
- Coffee
- Tea
- Milk
Po usunięciu:
- Tea
- Milk
Przykład
Usuń wszystkie węzły podrzędne listy:
// 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);
}
Przed wyjęciem:
- Coffee
- Tea
- Milk
Po usunięciu:
Przykład
Usuń element <li> z id="myLI" z jego elementu rodzica (bez określania jego węzła rodzica):
var item = document.getElementById("myLI");
item.parentNode.removeChild(item);
Przed wyjęciem:
- Coffee
- Tea
- Milk
Po usunięciu:
- Coffee
- Milk
Przykład
Usuń element <li> z jego rodzica i wstaw go ponownie:
var item = document.getElementById("myLI");
function removeLi() {
item.parentNode.removeChild(item);
}
function appendLi() {
var list = document.getElementById("myList");
list.appendChild(item);
}
Przykład
Usuń element <span> z jego rodzica i wstaw go do elementu <h1> w innym dokumencie:
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);
}