Question

这是我的代码：

  <div id="principal" class="classxx">
    <div class="class001 cat2 blabla">
      <div class="class002">
        <div class="class003"></div>
        <div class="class004"></div>
        <div class="class005"></div>
      </div>
    </div>
    <div class="class001 cat3 blabla">
      <div class="class002">
        <div class="class003"></div>
        <div class="class004"></div>
        <div class="class005"></div>
      </div>
    </div>
    <div class="class001 cat1 blabla">
      <div class="class002">
        <div class="class003"></div>
        <div class="class004"></div>
        <div class="class005"></div>
      </div>
    </div>
  </div>

我需要一个像：

这样的功能

function showOnlyCat(className){}

如果我打电话给showOnlyCat('cat3')我想只看到所有拥有'cat3'类的DIV（每个DIV有多个类）及其子级当然该函数必须仅针对DIV＃principal

的第一个子节点

而且我还需要一个showAllCat()来显示DIV＃principal

的所有孩子DIV

非常感谢你的帮助

Answer 1

function showOnlyCat(className){
 $("#principal").children().hide().filter("."+className).show();
}

function showAllCat(){
 $("#principal").children().show();
}

编辑：修正了错误。测试。它有效。

Edit2：遵循@gnarf的好建议

Answer 2

你好jQuery你可以这样做：

function showAllCat() {
    $('#principal div').each(function() {
        $(this).css('display', 'block');
    })
}

function showOnlyCat(className) {
    $('#principal div:not(.' + className + ')').each(function() {
        $(this).css('display', 'none');
    })

    $('#principal div.' + className).each(function() {
        $(this).css('display', 'block');
    })
}

//other way:
function showOnlyCat1(className) {
    //hide all
    $('#principal div').each(function() {
        $(this).css('display', 'none');
    })
    //showing only class parameter
    $('#principal div.' + className).each(function() {
        $(this).css('display', 'block');
    })
}

jQuery - 显示/隐藏DIV是他们有一定的类

2 个答案: