Добавление содержимого перед элементом или после него

В предыдущем разделе мы рассмотрели изменение внутреннего содержимого элемента. Библиотека jQuery предоставляет также методы, которые позволяют добавить какое-либо содержимое перед элементом или после него. Рассмотрим эти методы.

$("#div1").after("<u>Новый текст</u>");
<div id="div1">Текст</div>

Результат будет выглядеть следующим образом.

<div id="div1">Текст</div><u>Новый текст</u>

Теперь добавим DOM-элемент.

$("#div1").after($("<u>Новый текст</u>").get(0));

А теперь добавим созданный элемент коллекции jQuery.

$("#div1").after($("<u>Новый текст</u>"));
$("#div1").before("<u>Новый текст</u>");
<div id="div1">Текст</div>

Результат будет выглядеть следующим образом.

<u>Новый текст</u><div id="div1">Текст</div>
$("<u>Новый текст</u>").insertAfter("#div1");

Результат будет таким же, как и при использовании метода after().

$("#div1").after("<u>Новый текст</u>");
$("<u>Новый текст</u>").insertBefore("#div1");

Результат будет таким же, как и при использовании метода before().

$("#div1").before("<u>Новый текст</u>");
Предыдущая статья Все статьи Следующая статья