Метод before

Методът before добавя текст преди зададения елемент. Съществува и метод insertBefore, който работи по подобен начин.

Синтаксис

Добавяне на текст преди елемент:

javascript$(селектор).before(текст);

Ето как преди избраните елементи ще бъде добавен текст, който ще бъде върнат от потребителска функция:

javascript$(селектор).before(function(номер в набора));

Още един вариант за използване на функцията, като втори параметър се задава старата html стойност на елемента:

javascript$(селектор).before(function(номер в набора, html низ));

Текстът може да бъде не само обикновен текст, но и DOM елемент или jQuery обект. В този случай тези елементи ще бъдат преместени от собствената си позиция в HTML кода.

Пример

Нека добавим текст преди зададения параграф:

html<p id="test">text</p>
javascript$('#test').before('!!!');

HTML кодът ще изглежда така:

html!!!<p id="test">text</p>

Пример

Нека добавим текст с тагове преди зададения параграф:

html<p id="test">text</p>
javascript$('#test').before('<p>!!!</p>');

HTML кодът ще изглежда така:

html<p>!!!</p><p id="test">text</p>

Пример

Нека поставим един параграф над друг (т.е. да изрежем параграфа от старото му място и да го поставим на ново):

html<p id="p1">text1</p>
<p id="p2">text2</p>
javascript$('#p2').before('#p1');

HTML кодът ще изглежда така:

html<p id="p2">text2</p>
<p id="p1">text1</p>

Вижте също

  • метод insertBefore,
    който добавя текст преди зададения елемент
  • методи after, append, prepend,
    позволяващи добавяне на съдържание в определено място на страницата
  • метод clone,
    който създава копия на избраните елементи