HTML DOM Öğesi appendChild()

❮ Önceki ❮ Öğe Nesne Referansı Sonraki ❯

Örnekler

Listeye bir öğe ekleyin:

const node = document.createElement("LI");
const textnode = document.createTextNode("Water");
node.appendChild(textnode);
document.getElementById("myList").appendChild(node);

Coffee
Tea

Sonrasında:

Coffee
Tea
Water

Bir öğeyi bir listeden diğerine taşıma:

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

Coffee
Tea

Water
Milk

Sonrasında:

Coffee
Tea
Milk

Water

Aşağıda daha fazla örnek.

Tanım ve Kullanım

Yöntem appendChild(), bir düğümün son çocuğu olarak bir düğüm ekler.

İpucu: Metin içeren yeni bir paragraf oluşturmak istiyorsanız, metni paragrafa ekleyeceğiniz bir Metin düğümü olarak oluşturmayı ve ardından paragrafı belgeye eklemeyi unutmayın.

Bir öğeyi bir öğeden diğerine taşımak için de bu yöntemi kullanabilirsiniz (Bkz. "Diğer Örnekler").

Ayrıca bakınız:

Element firstChild Özellik

LastChild Özelliği Öğesi

Öğe insertBefore() Yöntemi

Sözdizimi

node.appendChild(node)

parametreler

Parameter	Description
node	Required. The node to append.

Geri dönüş değeri

Tip	Açıklama
düğüm	eklenen düğüm

Daha fazla örnek

Bir <p> öğesi oluşturun ve onu bir <div> öğesine ekleyin:

const para = document.createElement("p");
const node = document.createTextNode("This is a paragraph.");

para.appendChild(node);
document.getElementById("myDIV").appendChild(para);

Bir <p> öğesi oluşturun ve onu belgenin gövdesine ekleyin:

const para = document.createElement("P");
const node = document.createTextNode("This is a paragraph.");

para.appendChild(node);
document.body.appendChild(para);