jQuery:将每四个 LI 转换为一个

Question

我正在开发一个 slider ，我想将每四个 LI 转换为一个 LI。

slider 显示当时有四个元素的 LI。我希望内容是 LI 中包含的 SPAN。

来自:(每个 LI 一个 SPAN)

<li><span>#Content</span></li>
<li><span>#Content</span></li>
<li><span>#Content</span></li>
<li><span>#Content</span></li>
<li><span>#Content</span></li>
<li><span>#Content</span></li>

...进入:(每个 LI 四个 SPAN)

<li><span>#Content</span><span>#Content</span><span>#Content</span><span>#Content</span></li>
<li><span>#Content</span><span>#Content</span></li>

我似乎无法在互联网上找到任何有关此技术的信息。我该怎么办？

这有什么意义吗？抱歉我的英语不好......

Answer 1

您可以使用 .slice() 循环遍历和 .wrapAll() 像这样:

var spans = $("li span").unwrap();
for(var i = 0; i < spans.length; i+=4) {
  spans.slice(i, i+4).wrapAll("<li />");
}

You can test it out here 。它的作用是 .unwrap() 删除开头的 <li>包装器，然后循环插入 4，使用 .slice() 获取我们正在使用的集合(它将正确处理最后 4 个或更少)并使用 .wrapAll() 关于那些<span>元素将它们放入新的 <li> .