jquery - 如何在 div 中不显示所有 ul,li 标签，除了 li 有一个带有类 html 的标签

Question

我有一个包含内容的 Div

<div id="dv">

<ul><li><a class="html">abcd</a></li></ul>

<ul><li><a class="bold">cdef</a></li></ul>

<ul><li><a class="bold">xyz</a></li></ul>

</div>

我想动态显示第二个和第三个 ul。我怎样才能做到这一点 ？

Answer 1

您可以找到 div 的所有子项，隐藏它们，然后找到ul包含liwith 类"html"并显示ul：

$("#dv").children('ul').hide().find('li.html').closest('ul').show();

实例| 资源

那是做什么的：

• $("#dv")- 找到相关的 div
• .children('ul')- 找到它的子ul元素
• .hide()- 隐藏它们
• .find('a.html')- 在那些s 中查找任何具有类的a元素ul"html"
• .closest('ul')- 获取ul包含该a元素
• .show()- 显示它

Answer 2

我能想到的最简单的是这个

$("#dv li a:not(.html)").parent().hide();

编辑：@ByScripts 建议使用closest()而不是parent().

$("#dv li a:not(.html)").closest("ul").hide();

Answer 3

您可以在下面使用jQuery

$("#dv ul:nth-child(2),#dv ul:nth-child(3)").hide()

Answer 4

据我了解，您想删除<li>with aclass 'html' 。下面是代码

$("#div ul li a.html").hide(function(){
    $(this).parent().hide();    
});

Answer 5

基于 xFortyFourx 答案：

$("#dv a:not(.html)").closest('ul').hide();

编辑：我认为很多参与者没有阅读标题。OP想要<ul>根据元素隐藏class="html"。不是解决方案；）<a>slice()

Answer 6

这是你想要的吗？

$("#dv ul").hide(); // hide all divs
$("#dv a.html").closest("ul").show(); // show the div that contains a.html

Answer 7

如果您想显示除第一个 ul 之外的所有 ul，请尝试以下代码：

$("#dv ul").css('display','none');
if($("#dv ul").hasClass('html')){
$(".html").closest('ul').('display','block');
 }

Answer 8

如果需要隐藏第二个和第三个，我建议使用sliceul。

$('#dv ul').slice(1).hide();