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

Метод wrap

Метод wrap оборачивает элементы в заданный тег.

Синтаксис

Параметром метода может служить текст (возможно с тегами), DOM элемент или объект jQuery:

.wrap(чем обернуть);

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

.wrap(function(номер в наборе));

Пример

Обернем все абзацы с классом www тегом div:

<p class="www">text</p> <p class="www">text</p> <p class="www">text</p> <p>text</p> $('.www').wrap(document.createElement('div'));

HTML код станет выглядеть так:

<div><p class="www">text</p></div> <div><p class="www">text</p></div> <div><p class="www">text</p></div> <p>text</p>

Пример

Параметром можно передавать не только имя тега, но и следующую конструкцию:

<p class="www">text</p> <p class="www">text</p> <p class="www">text</p> <p>text</p> $('.www').wrap('<div></div>');

HTML код станет выглядеть так:

<div><p class="www">text</p></div> <div><p class="www">text</p></div> <div><p class="www">text</p></div> <p>text</p>

Пример

В открывающий тег можно писать любые атрибуты, при этом оборачивание будет вместе с этими атрибутами. Давайте обернем абзацы с классом www дивом с классом zzz:

<p class="www">text</p> <p class="www">text</p> <p class="www">text</p> <p>text</p> $('.www').wrap('<div class="zzz"></div>');

HTML код станет выглядеть так:

<div class="zzz"><p class="www">text</p></div> <div class="zzz"><p class="www">text</p></div> <div class="zzz"><p class="www">text</p></div> <p>text</p>

Смотрите также

  • методы wrapAll, wrapInner, unwrap,
    позволяющие работать с оборачиванием элементов
byenru