Оглавление

.wrap()

 С помощью метода .wrap() разработчик может легко и быстро поместить существующий элемент в оболочку, образованную одним или несколькими новыми элементами.

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

 
Для начала поместим все дескрипторы span в тестовом документе в дескрипторы strong, используя следующий код:
$("span").wrap("<strong />");
В результате выполнения этого кода текст внутри двух элементов span выделится полужирным шрифтом (рис. 2.8).

 

Тексте контейнерах span

Рис. 2.8. Тексте контейнерах span, окруженных дескрипторами strong, отображается в браузере с использованием полужирного шрифта

 

Команда для помещения элемента внутрь оболочки имеет сравнительно свободный синтаксис, и результат, представленный на рис. 2.8, можно было бы получить с использованием любого из аргументов  

"<strong />", "<strong>" и "<strong> </strong>".

 
Кроме того, оболочкой могут служить сразу несколько дескрипторов, передаваемых методу .wrap() в виде набора вложенных дескрипторов.
$("span").wrap("<strong><em></em></strong>");

После выполнения этого кода текст внутри контейнеров span выделится в окне браузера полужирным курсивом (рис. 2.9).

 

Текст в контейнерах span

Рис, 2.9. Текст в контейнерах span, окруженных дескрипторами strong и em, отображается в браузере с использованием полужирного курсивного шрифта

 
Чтобы воспользоваться функцией обратного вызова для генерации требуемого дескриптора HTML, которым должен быть окружен элемент, вы должны возвратить из нее этот дескриптор. Например, чтобы окружить все элементы span с классом foo дескрипторами strong, а все остальные элементы span — дескрипторами em, используйте следующий код.
$("span").wrap(function() {
    return $(this).is(".foo") ? "<strong>" "<em>";
})
После выполнения этого кода текст в одном из контейнеров span отобразится в окне браузера курсивным шрифтом, а в другом (имеющем класс foo) — полужирным (Рис. 2.10).

 

Текст в контейнерах span 

Рис. 2.10. Использование функции обратного вызова для заключения определенных дескрипторов в оболочку при выполнении определенных условий

Комментарии принадлежат их авторам. Мы не несем ответственности за их содержание.
Отправитель Нити