javascript - 使用 each() 遍历多个 ul 并隐藏任何大于 8 的子 li

标签 javascript jquery html css

需要一些帮助来理解如何使用 ul.children 类遍历所有 ul 元素并隐藏 ul.child 下大于 8 的任何子元素。

我的代码示例如下:

$(function() {
$('ul.children').each(function() {
    var $ul = $(this);
    if($ul.children().length > 8) {
        $ul.hide();
    } 
});
});

我的 html 代码示例:

<ul class="children>
   <li>1</li>
   <li>2</li>
   <li>3</li>
   <li>4</li>
   <li>5</li>
   <li>6</li>
   <li>7</li>
   <li>8</li>
   <li>hide all other li elements below this point</li>
</ul>

<ul class="children>
   <li>1</li>
   <li>2</li>
   <li>3</li>
   <li>4</li>
   <li>5</li>
   <li>6</li>
   <li>7</li>
   <li>8</li>
   <li>hide all other li elements below this point</li>
</ul>

最佳答案

$("ul.children").find("li:gt(7)").hide();

演示: http://jsfiddle.net/7TtKD/


@Vitaliy Petrychuk 建议的另一种解决方案在评论中:

$(".children > li:nth-child(n+9)").hide();

关于javascript - 使用 each() 遍历多个 ul 并隐藏任何大于 8 的子 li,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14425086/

相关文章:

web-applications - 使用XSS填写输入并提交

Javascript:keyup 事件的输入计算其总和

javascript - ajax 调用后多选不起作用

javascript - 像这个例子跳过去

javascript - 声明顺序 javascript 变量的紧凑方法?

jquery - Bootstrap 汉堡菜单不起作用

jquery - 使用jquery将标签类添加到另一个标签

html - 如何在没有 Javascript 的情况下使 Ul 可点击

jquery - iOS 6 选择菜单与 iOS 7 选择菜单

javascript - 我在这个 Angular HTTP 请求中做错了什么?