Оглавление

5.3. Вложение элементов


Все элементы коллекции можно разместить в каком-либо другом элементе. Для вложения элементов предназначены следующие методы.
wrapInner(<HTML-элемент или DOM-элемент>)— вкладывает внутреннее содержимое каждого элемента коллекции в другой элемент. Для примера выделим содержимое всех тегов <div>.

   $("div").wrapInner("<b></b>");

       <div>Текст l</div>

   <div>Текст 2</div>
Результат будет выглядеть следующим образом.

   <div><b>Текст l</b></div>

   <div><b>Текст 2</b></div>

Такого же эффекта можно достичь, передав в качестве параметра DOM-элемент.

   $("div").wrapInner(document.createElement("b"));  

Можно также передать элемент, созданный с помощью функции $().

   $("div").wrapInner($("<b></b>"));

 

wrap(< HTML-элемент или DOM-элемент>)— полностью вкладывает каждый элемент коллекции в другой элемент.
    $("div").wrap("<b></b>");

    <div>Текст l</div>

      <div>Текст 2</div>

Результат выполнения таков:

   <b><div>Текст l</div></b>  

   <b><div>Текст 2</div></b>

 

wrapAll(<HTML-элемент или DOM-элемент>) —  собирает  все  элементы коллекции в одном месте и вкладывает их в другой элемент.

    $("div").wrapAll("<u></u>");

   <b>Какой-то текст 1</b> 
   <div>Текст l</div> 
   <b>Какой-то текст 2</b> 
   <div>Текст 2</div> 
   <b>Какой-то текст 3</b> 
   <div>Текст 3</div>

Результат будет выглядеть следующим образом.

   <b>Какой-то текст 1</b>
   <u>
     <div>Текст l</div>
     <div>Текст 2</div>
     <div>Текст 3</div>
   </u>
   <b>Какой-то текст 2</b>

   <b>Какой-то текст 3</b>

Как видно из примера, все элементы коллекции были размещены после первого элемента и расположены внутри тега <u>.

 

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