Новичок
11 уроков
(2 часа 6 минут)
Курс
Основы jQuery
Данный видеокурс познакомит вас с основами популярной библиотеки jQuery.

#7 — Манипуляции с элементами.

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

Существует множество вариантов изменения документа путем реализации методами jQuery разнообразных действий с элементами. Элементы можно вставлять в нужное место DOM, удалять
их, оборачивать ими другие элементы, заменять и копировать.

Изучив данный урок, вы сможете, используя jQuery, вставить элемент в документ. Более
подробно на конкретном примере будут рассмотрены способы оборачивания одних элементов
в другие.

Приятного всем просмотра! Учитесь с удовольствием!

Знакомимся с функциями:

Вставки последним ребенком

    • e.append(s) — добавит s последним в e
    • e.appendTo(s) — добавит e последним в s

Вставки первым ребенком

    • e.prepend(s) — добавит s первым в e
    • e.prependTo(s) — добавит e первым в s

Вставки перед элементом

    • e.before(s) — добавит s перед e
    • e.insertBefore(s) — добавит e перед s

Вставки после элемента

    • e.after(s) — добавит s после e
    • e.insertAfter(s) — добавит e после s

Оборачивания

    • e.wrap(s) — обернет снаружи элементом s каждый из e элементов e
    • e.wrapInner(s) — обернет внутри элементом s каждый из e элементов
    • e.wrapAll(s) — обернет все e элементом s

Удаление содержимого

    • e.remove() — удаляет элементы e со страницы
    • e.empty() — очищает содержимое элементов e
    • e.unwrap() — удаляет родителя, оставляя содержимое

Замена элементов

    • e.replaceWith(s) — заменяет e на s
    • e.replaceAll(s) — заменяет s на e

Копирование элементов

    • e.clone([withDataAndEvents]) — создает копию узла e со всем его содержимым. Если передать на вход значение true, то скопируются еще и данные узла, а также обработчики его событий (по умолчанию на входе false).

Добавление/изменение содержимого

  • e.html([s]) — без параметров — возвращает html-содержимое элемента e, с параметром (html строка или элементы) — заменяет на них содержимое элемента e
  • e.text([string]) — без параметров — возвращает текст, содержащийся в элементе e, с параметром — заменяет текст в элементе e

Материалы к уроку:
Делись:

Оставь комментарий!

Добавить комментарий

Рекомендуемые курсы