Метод after - добавление текста после элемента
Метод after
добавляет текст после
заданного элемента. Также существует метод
insertAfter
,
который работает аналогичным образом.
Синтаксис
Вставка текста после элемента:
$(селектор).after(текст);
Вот так после выбранных элементов будет добавлен текст, который будет возвращен пользовательской функцией. Функция вызывается, отдельно для каждого из выбранных элементов. В первый параметр этой функции попадает номер в наборе каждого из выбранных элементов (по очереди), во второй - текущее содержимое элемента:
$(селектор).after(function(номер в наборе, текущее содержимое элемента));
Текст также может быть не только обычным текстом, но и DOM элементом или объектом jQuery. В этом случае эти элементы переместятся со своей позиции в HTML коде.
Пример
Давайте вставим текст после заданного абзаца:
<p id="test">text</p>
$('#test').after('!!!');
HTML код станет выглядеть так:
<p id="test">text</p>!!!
Пример
Давайте вставим текст с тегами после заданного абзаца:
<p id="test">text</p>
$('#test').after('<p>!!!</p>');
HTML код станет выглядеть так:
<p id="test">text</p><p>!!!</p>
Пример
Давайте переместим один абзац под другой (то есть вырежем абзац со старого места и поставим в новое):
<p id="p1">text1</p>
<p id="p2">text2</p>
$('#p1').after('#p2');
HTML код станет выглядеть так:
<p id="p2">text2</p>
<p id="p1">text1</p>
Смотрите также
-
метод
insertAfter
,
который добавляет текст после заданного элемента -
методы
before
,append
,prepend
,
позволяющие добавлять содержимое в определенное место на странице -
метод
clone
,
который создает копии выбранных элементов