使用jQuery仅在div中包装前3项

时间:2013-09-16 10:54:59

标签: jquery html asp.net css

我正在使用ASP.NET动态地将内容添加到li中。在ul中我想围绕列表的前3个li项包装div类。 e.g。

                <ul class="wrapper">
                    <div class="recommend">
                            <li><a href="#"><img src="#" /></a></li>
                            <li><a href="#"><img src="#" /></a></li>
                            <li><a href="#"><img src="#" /></a></li>
                    </div>
                            <li><a href="#"><img src="#" /></a></li>
                            <li><a href="#"><img src="#" /></a></li>
                            <li><a href="#"><img src="#" /></a></li>
                            <li><a href="#"><img src="#" /></a></li>
                            <li><a href="#"><img src="#" /></a></li>
                </ul>

我发现获得此结果的最接近的是我找到并编辑过的小提琴。 http://jsfiddle.net/ZuK4E/但它每3个而不是仅仅前3个。所有的lis是相同的,所以不能用任何目标瞄准。

2 个答案:

答案 0 :(得分:8)

DEMO

$('ul.wrapper > li:lt(3)').wrapAll('<div class="recommend"></div>');

lt(3)将选择first three元素作为索引从0开始。(即0,1,2)

:lt文档

答案 1 :(得分:0)

快速而肮脏的方法,我正在努力寻找更好的方法。 然后使用这个:)

for (var i = 0; i < a.length; i += 3) {
if (i < 1) {
    a.slice(i, i + 3).wrapAll('<div class="recommend"></div>');
}
}