Element.insertBefore()

Element.insertBefore() - вставляє елемент перед вказаним дочірним елементом.

Синтаксис:

insertedElement = Element.insertBefore(newEl, existingEl);

Параметри:

insertedElement - зміна яка отримує вставлений елемент.

Element - об'єкт Element.

newEl - елемент який необхідно вставити.

existingEl - елемент перед яким необхідно вставити newEl.

Опис:

insertBefore() метод об'єкту Element який вставляє елемент перед вказаним дочірним елементом.

Щоб додати елемент в кінець дочірніх елементів використовуйте Element.appendChild().

Приклад:

абзац 1

абзац 2

абзац 3

var newEl = document.createElement("p");
newEl.innerText="текст";

var el = document.getElementById("test");

var insertEl = el.insertBefore( newEl , el.firstElementChild );

alert( insertEl );

Вставляємо створений елемент на початку документу:

var el = document.createElement("div");
el.innerText="*** JavaScript ***";
el.align="center";
el.style.backgroundColor="#ae9078";
document.body.insertBefore( el , document.body.firstElementChild);

Вставляємо новостворений елемент перед третім елементом P:

 var newEl = document.createElement("p");
newEl.innerText="ТЕСТ";
newEl.style.backgroundColor="#8811fe";

var el = document.getElementById("test");

el.insertBefore( newEl , el.getElementsByTagName("p")[2] );

Додаємо елемент на початок дочірніх елементів:

var el=document.createElement('p');
el.innerText=Date();

document.getElementById('test2').insertBefore(el, document.getElementById('test2').firstChild);