<MyRusakov.ru />

React JS, Redux, ES2015 с Нуля до Гуру

React JS, Redux, ES2015 с Нуля до Гуру

Данный курс - это обширный курс по JavaScript и фреймворку React, который позволит Вам с нуля создавать мощные современные, динамические JavaScript-приложения.

Вы узнаете о тонкостях работы с "профессиональным" JavaScript, а так же узнаете о нововведениях в его новый стандарт ES2015, Вы узнаете, как организовать профессиональное окружение для FrontEnd, изучите профессиональный фреймворк - ReactJS.

А в практической части с полного нуля будет создано мощное и быстрое динамическое приложение, где Вы на практике познакомитесь, как создавать очень гибкую и расширяемую архитектуру, для разработке функционала любой сложности.

Подробнее
Подписка

Подписавшись по E-mail, Вы будете получать уведомления о новых статьях.

Подписка Подписаться

Добавляйтесь ко мне в друзья ВКонтакте! Отзывы о сайте и обо мне оставляйте в моей группе.

Мой аккаунт Мой аккаунт Моя группа
Опрос

Каким движком Вы предпочитаете пользоваться?

Добавление и удаление элементов на jQuery

Добавление и удаление элементов на jQuery

В предыдущих статьях по jQuery мы разобрали возможности по выборке и работе с элементами из этой выборки. А в этой статье мы разберём важные возможности по добавлению и удалению элементов на jQuery.

Начнём мы с добавления элементов на jQuery:

<a href="#">Ссылка</a>
<a href="#">Ссылка</a>
<a href="#">Ссылка</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>

По сути, удаление бывает двух типов: очищение содержимого (это делает метод empty()) и полное удаление элемента (это делает метод remove()).

Это всё самое важное, что касается добавления и удаления элементов на jQuery.

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Порекомендуйте эту статью друзьям:

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

  1. Кнопка:

    Она выглядит вот так: Как создать свой сайт

  2. Текстовая ссылка:

    Она выглядит вот так: Как создать свой сайт

  3. BB-код ссылки для форумов (например, можете поставить её в подписи):

Комментарии (4):

lev_100rus lev_100rus 17.10.2013 18:03:28

Нехорошо комментарии-то удалять!

Ответить

Admin Admin 17.10.2013 21:59:21

Я не считаю, что комментарий "'в внутри' - вы уверены, что так будет правильно?" является тематическим к статье. Когда мне пишут об орфографических ошибках, я их всегда исправляю. И не вижу смысла в сохранении подобных комментариев.

Ответить

SV SV 19.11.2015 13:55:24

Если такая конструкция, $('.a , .b').remove(); то удаляются элементы имеющие класс a или b. Я правильно понял?

Ответить

vegas vegas 23.06.2015 12:43:01

Спасибо за статью, Миша! Как всегда, предельно лаконично, а главное — понятно и полезно. :) Отдельный респект за комментарии к коду!

Ответить

Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.