Przykład
Wstawić nowy <li> elementu przed pierwszego elementu potomnego <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>Przed włożeniem:
- Coffee
- Tea
Po włożeniu:
- Water
- Coffee
- Tea
Spróbuj sam " Więcej "Try it Yourself" przykłady poniżej.
Definicja i Wykorzystanie
insertBefore() metoda wstawia węzeł jako dziecko, tuż przed istniejącym dziecka, które można określić.
Wskazówka: Jeśli chcesz utworzyć nową pozycję na liście, z tekstem, należy pamiętać, aby utworzyć tekst jako węzła Text którego dołączone do <li> elementu, a następnie włóż <li> do listy.
Można również użyć metody insertBefore włożyć / przenieść istniejący element (See "More Examples") .
Wsparcie przeglądarka
Liczby w tabeli określ pierwszą wersję przeglądarki, która w pełni obsługuje metodę.
| metoda | |||||
|---|---|---|---|---|---|
| insertBefore() | tak | tak | tak | tak | tak |
Składnia
wartości parametrów Parametr Rodzaj Opis newnode Node object Wymagany. Przedmiotem węzeł chcesz wstawić existingnode Node object Opcjonalny. Węzeł dziecko chcesz przed włożeniem nowego węzła. Gdy nie podano, metoda insertBefore będzie wstawić newNode na koniec
Szczegóły techniczne
Zwracana wartość: Obiekt węzeł reprezentujący wstawiony węzeł DOM Version Rdzeń poziomu obiektu 1 Węzeł
Więcej przykładów
Przykład
Przenoszenie <li> elementu z jednej listy do drugiej:
var node = document.getElementById("myList2").lastChild;
var
list = document.getElementById("myList1");
list.insertBefore(node, list.childNodes[0]); Przed włożeniem:
- Coffee
- Tea
- Water
- Milk
Po insertBefore:
- Milk
- Coffee
- Tea
- Water
Spróbuj sam "