Question

我有两组具有相同类名的无序列表，我想用jquery slice对其进行子集化。

var currentCount= 0;
var maxCount= 3;
$('.ulClassName>li').slice(currentCount,maxCount).show();

这适用于第一个UL（它仅显示前三个列表），但不会对具有相同类名的第二个UL进行切片。以下是标记：

<ul class="ulClassName" id="firstUL">
 <li>Blah blah1 </li>
 <li>Blah blah2 </li>
 <li>Blah blah3 </li>
 <li>Blah blah4 </li>
 <li>Blah blah5 </li>
 <li>Blah blah6 </li>
</ul>
<ul class="ulClassName" id="secondUL">
 <li>Blah blah1 </li>
 <li>Blah blah2 </li>
 <li>Blah blah3 </li>
 <li>Blah blah4 </li>

我理解jquery索引页面中的所有列表元素，我不想为这两个列表编写单独的代码，有人可以帮助我吗？

Answer 1

您可能想要致电：

$('.ulClassName').each(function() {
   $(this).find('li').slice(currentCount, maxCount).show();
});

Answer 2

另一种方法是使用nth-child选择器与nextAll结合使用，以避免使用slice，它同时对整个集合进行操作：

$('.ulClassName > li:nth-child(4)').prevAll().show();

或者，

$('.ulClassName > li:nth-child(3) ~ li').hide();

（此隐藏第三个li元素下的所有内容，与第一个元素不同，但应该更高效，因为~ li可以document.querySelectorAll()进行评估对于现代浏览器）

Answer 3

$('ul.sideFilter').each(function(){ 

$(this).find('li').slice(5).wrap("<ul></ul>");


});

jquery - 如何在两个不同的无序列表中切割元素？

3 个答案: