En son web geliştirme öğreticiler
 

HTML DOM insertBefore() Method

<Eleman Nesne

Örnek

Takın yeni <li> bir ilk alt öğe önce eleman <ul> elemanı:

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>

takmadan önce:

  • Coffee
  • Tea

taktıktan sonra:

  • Water
  • Coffee
  • Tea
Kendin dene "

Daha "Try it Yourself" Aşağıdaki örnekler.


Tanımı ve Kullanımı

insertBefore() metodu doğru belirttiğiniz varolan çocuk, önce bir çocuk olarak bir düğümü ekler.

İpucu: metin ile yeni bir liste öğesi oluşturmak için isterseniz, eklenecek bir metin düğümü olarak metni oluşturmak unutmayın <li> Daha sonra, eleman eklemek <li> listeye.

Ayrıca, mevcut bir elemanını hareket / eklemek için insertBefore yöntemini kullanabilirsiniz (See "More Examples") .


Tarayıcı Desteği

Tablodaki rakamlar tam yöntemini destekleyen ilk tarayıcı sürümü belirtin.

Yöntem
insertBefore() Evet Evet Evet Evet Evet

Sözdizimi

Parametre Değerleri
Parametre tip Açıklama
newnode Node object Gereklidir. Eklemek istediğiniz düğüm nesnesi
existingnode Node object İsteğe bağlı. alt düğüm daha önce yeni bir düğüm eklemek istiyorum. Belirtilen zamanlarda, insertBefore yöntemi sonunda newnode ekleyecektir

Teknik detaylar

Geri dönüş değeri: eklenen düğüm temsil eden bir düğüm nesnesi,
DOM Sürüm Çekirdek Seviye 1 Düğüm Nesne

Örnekler

Diğer Örnekler

Örnek

Bir Taşı <li> bir listeden diğerine eleman:

var node = document.getElementById("myList2").lastChild;
var list = document.getElementById("myList1");
list.insertBefore(node, list.childNodes[0]);

takmadan önce:

  • Coffee
  • Tea
  • Water
  • Milk

insertBefore sonra:

  • Milk
  • Coffee
  • Tea
  • Water
Kendin dene "

<Eleman Nesne