Обертывание вещи с помощью jQuery - PullRequest
Новая
       4

Обертывание вещи с помощью jQuery

1 голос
/ 17 ноября 2010

Мне нужно получить некоторые элементы списка внутри оболочки div / span.Вот как сейчас: 

<ul>
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
<li>Five</li>
<li>Six</li>
</ul>

Мне нужно что-то вроде этого: 

<ul>
<div class="wrapper">
<li>One</li>
<li>Two</li>
</div><div class="wrapper">
<li>Three</li>
<li>Four</li>
</div><div class="wrapper">
<li>Five</li>
<li>Six</li>
<div class="wrapper">
</ul>

Или это может быть чем-то вроде spanНе имеет значения.Но мне нужно обернуть после каждых трех элементов li.

Ответы [ 2 ]

2 голосов
/ 17 ноября 2010

Вы можете перебирать свои элементы и оборачивать их, используя .slice() и .wrapAll(), например: 

var lis = $("ul li");
for(var i = 0; i < lis.length; i+=3) {
  lis.slice(i, i+3).wrapAll('<li class="wrapper"><ul></ul></li>');
}

Поскольку вы что-то сказали как a <div> / <span> это сделает работу и даст вам действительный HTML, например: 

<ul>
  <li class="wrapper">
    <ul>
      <li>One</li>
      <li>Two</li>
      <li>Three</li>
    </ul>
  </li>
  <li class="wrapper">
    <ul>
      <li>Four</li>
      <li>Five</li>
      <li>Six</li>
    </ul>
  </li>
</ul>

Ваш пример показывает каждые 2 элемента, но в тексте вашего вопроса сказанокаждые 3 ... Я просто выбрал 3 здесь, просто отрегулируйте число в функции, и все готово.

0 голосов
/ 17 ноября 2010

Это недопустимый HTML, и это неправильно - вы не можете вставить div в список, но я дам для дальнейшего использования синтаксис переноса в jQuery: 

$("JQUERYSELECTOR").wrap("<div class='wrapper'></div>");

JQUERYSELECTOR должен быть любым элементом, который вы хотите обернуть, т.е. 

#ul:nth-child(1)

для первого ребенка в списке.

Но, опять же, упаковка div для элементов списка неверна.

...