Beispiel
Legen Sie ein neues <li> Element vor dem ersten Kind - Element eines <ul> Element:
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>Vor dem Einsetzen:
- Coffee
- Tea
Nach dem Einfügen:
- Water
- Coffee
- Tea
Versuch es selber " Mehr "Try it Yourself" Sie "Try it Yourself" Beispiele unten.
Definition und Verwendung
Die insertBefore() Methode fügt einen Knoten als Kind unmittelbar vor einem vorhandenen Kind, die Sie angeben.
Tipp: Wenn Sie ein neues Listenelement erstellen möchten, mit Text, denken Sie daran , den Text als Textknoten erstellen , die Sie zum Anfügen <li> Element, fügen Sie dann <li> auf der Liste.
Sie können auch die insert Methode zum Einfügen / ein vorhandenes Element bewegen (See "More Examples") .
Browser-Unterstützung
Die Zahlen in der Tabelle geben Sie die erste Browser-Version, die die Methode vollständig unterstützt.
| Methode | |||||
|---|---|---|---|---|---|
| insertBefore() | Ja | Ja | Ja | Ja | Ja |
Syntax
Parameterwerte Parameter Art Beschreibung newnode Node object Erforderlich. Der Knoten Objekt Sie einfügen möchten existingnode Node object Optional. Das Kind Knoten Sie wollen, bevor Sie den neuen Knoten einzufügen. Wenn nicht angegeben, wird die insert Methode , um die NewNode am Ende einfügen
Technische Details
Rückgabewert: Ein Knoten Objekt, die die Knoten eingefügt DOM Version Core Level 1 Knoten Object
Mehr Beispiele
Beispiel
Verschieben Sie ein <li> Element von einer Liste in einer anderen:
var node = document.getElementById("myList2").lastChild;
var
list = document.getElementById("myList1");
list.insertBefore(node, list.childNodes[0]); Vor dem Einsetzen:
- Coffee
- Tea
- Water
- Milk
Nach insert:
- Milk
- Coffee
- Tea
- Water
Versuch es selber "