Мелочи jQuery
Перейти к навигации
Перейти к поиску
Добавление и удаление элементов на jQuery
Добавления элементов на jQuery примеры:
<a href="#">Ссылка1</a>
<a href="#">Ссылка2</a>
<p class="link"></p>
<p class="link"></p>
<div id="links"></div>
<script type="text/javascript">
$("p.link").append("<a href='#'>Ссылка внутри тега p</a>"); // Добавляем новые ссылки внутрь тега <p class="link">
$("a").not("p.link a").appendTo($("#links")); // Переносим все ссылки, за исключением тех, которые находятся внутри тега <p class="link">, в блок #links
$("#links a").wrap("<p></p>"); // Обёртываем все ссылки внутри #links в тег <p>
/* Создание новых элементов и добавление их на страницу */
$("<span>Новый элемент 1</span>").insertAfter("div"); // Вставка span после всех div
$("<span>Новый элемент 2</span>").insertBefore("div"); // Вставка span перед всеми div
$("<span>Новый элемент 3</span>").appendTo("div"); // Вставка span внутрь div самым последним элементом
$("<span>Новый элемент 4</span>").prependTo("div"); // Вставка span внутрь div самым первым элементом
$("<span>Новый элемент 5</span>").insertAfter("div a:eq(1)"); // Вставка span сразу после 1-го (нумерация идёт с 0) тега a внутри div
</script>
Удаление элементов на jQuery примеры:
<div class="block_1"><span>Блок 1</span></div>
<div class="block_1"><span>Блок 1</span></div>
<div class="block_2"><span>Блок 2</span></div>
<script type="text/javascript">
$(".block_1").empty(); // Очищаем содержимое элементов с class="block_1"
$(".block_2").remove(); // Удаляем полностью элементы с class="block_2"
</script>