HTML DOM appendChild() Method

Przykład

Dołącz element z listy:

var node = document.createElement("LI");                 // Create a <li> node
var textnode = document.createTextNode("Water");         // Create a text node
node.appendChild(textnode);                              // Append the text to <li>
document.getElementById("myList").appendChild(node);     // Append <li> to <ul> with id="myList"

Przed dołączając:

Coffee
Tea

Po dołączenie:

Coffee
Tea
Water

Spróbuj sam "

Więcej "Try it Yourself" przykłady poniżej.

Definicja i Wykorzystanie

appendChild() metoda dołącza węzeł jako ostatnie dziecko węzła.

Wskazówka: Jeśli chcesz utworzyć nowy akapit, z tekstem, należy pamiętać, aby utworzyć tekst jako węzła Text którego dołączone do ust, a następnie dołączyć paragraf do dokumentu.

Można również użyć tej metody, aby przenieść element z jednego elementu do drugiego (See "More Examples") .

Wskazówka: Użyj insertBefore() metodę, aby wstawić nowy węzeł dziecko przed określonym, istniejącym, węzła potomnego.

Wsparcie przeglądarka

Liczby w tabeli określ pierwszą wersję przeglądarki, która w pełni obsługuje metodę.

metoda
appendChild()	tak	tak	tak	tak	tak

Składnia

node .appendChild( node )

wartości parametrów

Parametr	Rodzaj	Opis
node	Node object	Wymagany. Przedmiotem węzeł chcesz dołączyć

Szczegóły techniczne

Zwracana wartość:	Obiekt węzeł reprezentujący dołączony węzeł
DOM Version	Rdzeń poziomu obiektu 1 Węzeł

Więcej przykładów

Przykład

Przenieś element listy z jednej listy do drugiej:

var node = document.getElementById("myList2").lastChild;
document.getElementById("myList1").appendChild(node);

Przed dołączając:

Coffee
Tea

Water
Milk

Po dołączenie:

Coffee
Tea
Milk

Water

Spróbuj sam "

Przykład

Tworzenie <p> element i dołączyć go do <div> element:

var para = document.createElement("P");                       // Create a <p> node
var t = document.createTextNode("This is a paragraph.");      // Create a text node
para.appendChild(t);                                          // Append the text to <p>
document.getElementById("myDIV").appendChild(para);           // Append <p> to <div> with id="myDIV"

Spróbuj sam "

Przykład

Tworzenie <p> elementu z tekstem i dołączyć go do końca treści dokumentu:

var x = document.createElement("P");                        // Create a <p> node
var t = document.createTextNode("This is a paragraph.");    // Create a text node
x.appendChild(t);                                           // Append the text to <p>
document.body.appendChild(x);                               // Append <p> to <body>

Spróbuj sam "