jquery .show（）无效

Question

我有这个h1元素：

<h1><a id="toobin">Text here</a></h1>

我正在使用它来尝试并显示它：

$("#nav_list").click(function() {
    $("h1:gt(0)").hide();
    $("#toobin h1").show();
});

第一行隐藏了我所有的h1元素，并试图只显示一个bin bin h1元素不起作用。 如果我这样做$("h1").show();我可以显示所有h1元素。我做错了什么？

Answer 1

我认为你想要的是：

$("h1:has(#toobin)").show();

:has(<selector>)修饰符选择包含与括号选择器匹配的元素的元素。

#toobin h1表示h1内的所有#toobin，但#toobin位于h1内。

＆＃13;

＆＃13;

$("#nav_list").click(function() {
    $("h1:gt(0)").hide();
    $("h1:has(#toobin)").show();
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>First, won't be hidden</h1>
<h1>Will be hidden</h1>
<h1>Will also be hidden</h1>
<h1><a id="toobin">Should stay</a></h1>
<h1>Another hidden one</h1>
<button id="nav_list">Click to hide</button>

＆＃13;

＆＃13;

＆＃13;