使用hasClass（）显示匹配的列表项

Question

来自JavaScript新手的提问。 我有一个这样的清单：

<ul>
<li class="class1 class2"> </li>
<li class="class3 class4"> </li>
<li class="class1 class3"> </li>
</ul>

所有列表项最初都是隐藏的，我需要检查项目是否有某个类来显示它。如果有几个项目包含一个类，我需要全部显示它们。问题是，我不知道如何正确地定位元素：

if ($('li').hasClass('class3')) {
/* show this li */
}

我应该在这里写什么？

Answer 1

这不起作用，因为hasClass 只检查第一个li 返回li中是否有任何类。就这样做：

$('li.class3').show()

如果你的条件变得更复杂，另一种写作方式是：

$('li').filter(function() {
    return $(this).hasClass('class3');
}).show()

Answer 2

$("ul li").each(function() {
    if ($(this).hasClass('class3')) {
        //do what you need, 'this' is your li
    }
});

Answer 3

$('li').each(function() {
    if ($(this).hasClass('class3')){
       //Do stuff
    }
}).show()

Answer 4

试试这个

$('li.class3').css('display','block');
if($('li.class3').size()>3)
{
$('li').css('display','block');
}

Answer 5

我认为你可以添加它，并从兄弟姐妹中删除它： 这是最好的方式。

$("li").on("click", function(){
  $(this)
    .addClass("className")
    .siblings()
      .removeClass("className");
});