Метод after

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

Синтаксис

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

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

Така след избраните елементи ще бъде добавен текст, който ще бъде върнат от потребителската функция. Функцията се извиква отделно за всеки от избраните елементи. В първия параметър на тази функция се подава номерът в набора на всеки от избраните елементи (поред), а във втория - текущото съдържание на елемента:

javascript$(селектор).after(function(номер в набора, текущо съдържание на елемента));

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

Пример

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

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

javascript$('#test').after('!!!');

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

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

Пример

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

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

javascript$('#test').after('<p>!!!</p>');

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

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

Пример

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

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

javascript$('#p1').after('#p2');

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

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

Вижте също