jQuery选择要显示的孩子

【问题标题】：Jquery select which children to showjQuery选择要显示的孩子
【发布时间】：2013-01-23 22:44:10
【问题描述】：

我有以下 html

<div class="foo">
    <a href="" class="bar1">Bar1</a>
    <a href="" class="bar2">Bar2</a>
</div>

假设 .foo 默认隐藏，那么我只想显示 .foo 和他的孩子 .bar1。如何在 jquery 中做到这一点？

我的 jquery 中有这个

$('#' + id).children(".foo //anything I can do here to select ONLY bar1 to show? ").show();

【问题讨论】：

标签： jquery dom children

【解决方案1】：

我会隐藏所有孩子，只显示bar1。见下文，

var $foo = $('.foo');    //cache foo
$foo.children().hide();  //hide all foo's children
$foo.show();             //show foo
$foo.find('.bar1').show();  //show bar1

【讨论】：

【解决方案2】：

这会起作用。

$('#' + id).find(".foo .bar1").show();

【讨论】：

【解决方案3】：

$(".foo").show();
$(".foo").children(".bar1").show();

$(".foo").children("not:(.bar1)").hide();//if not hidden

【讨论】：

【解决方案4】：

你可以打字

$('.foo').toggle();

显示或隐藏 foo div 容器。

要选择栏1，你可以选择$('.foo > .bar1').somefunction()或$('.foo').children('.bar1').somefunction();

有很多不同的方法来选择你的元素......你也可以使用.hide() 或.show() 来管理你的元素是否隐藏

总是一个不错的链接顺便说一句：http://api.jquery.com/

【讨论】：