Exemple
Insérez un nouveau <li> élément avant le premier élément enfant d'un <ul> élément:
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>
Avant d'insérer:
- Coffee
- Tea
Après avoir inséré:
- Water
- Coffee
- Tea
Essayez vous - même » Plus "Try it Yourself" - "Try it Yourself" exemples ci - dessous.
Définition et utilisation
Le insertBefore() méthode insère un noeud comme un enfant, juste avant un enfant existant, que vous spécifiez.
Astuce: Si vous voulez créer un nouvel élément de liste, avec le texte, souvenez - vous de créer le texte comme un nœud de texte que vous ajoutez à <li> élément, puis insérez <li> à la liste.
Vous pouvez également utiliser la méthode insertBefore pour insérer / déplacer un élément existant (See "More Examples") .
Support du navigateur
Les chiffres du tableau indiquent la première version du navigateur qui prend en charge pleinement la méthode.
méthode | |||||
---|---|---|---|---|---|
insertBefore() | Oui | Oui | Oui | Oui | Oui |
Syntaxe
Les valeurs des paramètres Paramètre Type La description newnode Node object Champs obligatoires. L'objet de nœud que vous souhaitez insérer existingnode Node object Optionnel. Le nœud enfant que vous souhaitez insérer le nouveau nœud avant. Lorsqu'ils ne sont pas spécifiés, le procédé insertBefore insère le newnode à la fin
Détails techniques
Valeur de retour: Un objet de noeud représentant le noeud inséré version DOM Niveau de base 1 Noeud objet
autres exemples
Exemple
Déplacer un <li> élément d'une liste à l' autre:
var node = document.getElementById("myList2").lastChild;
var
list = document.getElementById("myList1");
list.insertBefore(node, list.childNodes[0]); Avant d'insérer:
- Coffee
- Tea
- Water
- Milk
Après insertBefore:
- Milk
- Coffee
- Tea
- Water
Essayez vous - même »