АКЦИЯ: бесплатные месячные курсы по созданию сайтов
на выбор: верстка, JavaScript, PHP или фреймворки. Сегодня последний день для записи! Жми!
16 of 119 menu

Метод 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,
    который создает копии выбранных элементов
enru