HTML DOM insertBefore() Yöntemi
Örnek
Bir <ul> öğesinin ilk alt öğesinden önce yeni bir <li> öğesi ekleyin:
var newItem = document.createElement("LI"); // Create a <li> node
var textnode = document.createTextNode("Water"); // Create a text node
newItem.appendChild(textnode); // Append the text to <li>
var list = document.getElementById("myList"); // Get the <ul> element to insert a new node
list.insertBefore(newItem, list.childNodes[0]); // Insert <li> before the first child of <ul>
Aşağıda daha fazla "Kendiniz Deneyin" örnekleri.
Tanım ve Kullanım
insertBefore() yöntemi, belirttiğiniz mevcut bir alt öğeden hemen önce bir alt öğe olarak bir düğüm ekler.
İpucu: Metin içeren yeni bir liste öğesi oluşturmak istiyorsanız, metni <li> öğesine ekleyeceğiniz bir Metin düğümü olarak oluşturmayı unutmayın, ardından listeye <li> ekleyin.
Mevcut bir öğeyi eklemek/taşımak için insertBefore yöntemini de kullanabilirsiniz (Bkz. "Diğer Örnekler").
Tarayıcı Desteği
Tablodaki sayılar, yöntemi tam olarak destekleyen ilk tarayıcı sürümünü belirtir.
Method | |||||
---|---|---|---|---|---|
insertBefore() | Yes | Yes | Yes | Yes | Yes |
Sözdizimi
node.insertBefore(newnode, existingnode)
Parametre Değerleri
Parameter | Type | Description |
---|---|---|
newnode | Node object | Required. The node object you want to insert |
existingnode | Node object | Required. The child node you want to insert the new node before. If set to
null , the insertBefore method will insert the newnode at the end |
Teknik detaylar
Geri dönüş değeri: | Eklenen düğümü temsil eden bir Düğüm Nesnesi |
---|---|
DOM Sürümü | Çekirdek Düzey 1 Düğüm Nesnesi |
Daha fazla örnek
Örnek
<li> öğesini bir listeden diğerine taşıyın:
var node = document.getElementById("myList2").lastChild;
var list = document.getElementById("myList1");
list.insertBefore(node, list.childNodes[0]);