javascript - 遍历数组并显示适当的 div

Question

我有一组从数据库返回给我的类。像这样的东西:

var styleClasses = ["ClassA", "ClassB", "ClassC", "ClassD"];

我有一个页面，其中的标记类似于:

<div class="main-details">
            <div class="ClassA" style="display:none;">
                <div class="Inner-Details">

                </div>
                <div class="Inner-Details">

                </div>
            </div>
            <div class="ClassB" style="display:none;">
                <div class="Inner-Details">

                </div>
                <div class="Inner-Details">

                </div>
            </div>
            <div class="ClassC" style="display:none;">
                <div class="Inner-Details">

                </div>
                <div class="Inner-Details">

                </div>
            </div>
</div>

我想要实现的是，无论我的数组中有什么类，我都希望显示适当的 div。我可以遍历数组并使用 .each 函数获取值，但我不知道如何将它与 div 类匹配并相应地显示它。

Answer 1

只需使用 jQuery 函数 .show()在 .each() 的每次迭代中的类上。

var styleClasses = ["ClassA", "ClassB", "ClassC", "ClassD"];

$(styleClasses).each(function(){
    $('.'+this).show(); // does this:  $('.classA').show();
});

JSFiddle Demo