我在HTML页面上有三个内部链接，当我单击它们时，它们会显示一段时间的文章元素，其中包含一些文本。每个链接都有一个单独的文章元素(当显示该元素时，应隐藏其他文章元素(。所选文章元素必须显示 2 秒，并在 3 秒后自动隐藏。
我的问题是，无论我单击哪个链接，它都会显示并隐藏所有文章元素，当它应该显示然后仅隐藏选定的元素时，并始终隐藏其他/未单击。我该如何改变这一点？这是我的代码。
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("a").click(function(){
$("article").show(2000).hide(3000);
$("article").siblings("article").hide();
});
});
</script>
</head>
<body class="siblings">
<a href="#Googlelink.1">Google Chrome</a> <br />
<a href="#Mozillalink.2">Mozilla Firefox</a> <br />
<a href="#Edgelink.3">Microsoft Edge</a> <br />
<article>
<a href="#Googlelink.1"><h1>Google Chrome</h1></a><br />
<p>Morbi eget urna lacinia, rutrum dolor ac, malesuada velit. Aliquam sit amet facilisis augue.
Pellentesque lorem purus, porttitor eget posuere sed, hendrerit a tortor. Suspendisse molestie leo sollicitudin ullamcorper commodo. In rhoncus hendrerit accumsan.
Cras et leo nec diam volutpat egestas. Maecenas ac viverra dui. Aliquam nibh enim, lacinia sed ipsum sed, imperdiet sollicitudin dui. </p>
</article>
<article>
<a href="#Mozillalink.2"><h1>Mozilla Firefox</h1></a><br />
<p>Morbi eget urna lacinia, rutrum dolor ac, malesuada velit. Aliquam sit amet facilisis augue.
Pellentesque lorem purus, porttitor eget posuere sed, hendrerit a tortor. Suspendisse molestie leo sollicitudin ullamcorper commodo.
In rhoncus hendrerit accumsan. Cras et leo nec diam volutpat egestas. Maecenas ac viverra dui. Aliquam nibh enim, lacinia sed ipsum sed, imperdiet sollicitudin dui. </p>
</article>
<article>
<a href="#Edgelink.3"><h1>Microsoft Edge</h1></a><br />
<p>Microsoft Edge is a web browser developed by Microsoft. It was first released for Windows 10 and Xbox One in 2015, then for Android and iOS in 2017,[8][9] and macOS in 2019.[10]
Edge includes integration with Cortana and has extensions hosted on the Microsoft Store. Unlike Internet Explorer, Edge does not support the legacy ActiveX and BHO technologies. </p>
</article>
</body>
</html>
隐藏所有文章，并使用单击的锚元素的 href 属性显示具有匹配 href 的文章：
$("article").hide();
$("a").click(function(){
href=$(this).attr('href');
$("article a").each(function(i,e){
if($(this).attr('href')==href){
$(this).parent().show(2000).hide(3000);
}
})
});
$(document).ready(function(){
$("article").hide();
$("a").click(function(){
href=$(this).attr('href');
$("article a").each(function(i,e){
if($(this).attr('href')==href){
$(this).parent().show(2000).hide(3000);
}
})
});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<body class="siblings">
<a href="#Googlelink.1">Google Chrome</a> <br />
<a href="#Mozillalink.2">Mozilla Firefox</a> <br />
<a href="#Edgelink.3">Microsoft Edge</a> <br />
<article>
<a href="#Googlelink.1"><h1>Google Chrome</h1></a><br />
<p>Morbi eget urna lacinia, rutrum dolor ac, malesuada velit. Aliquam sit amet facilisis augue.
Pellentesque lorem purus, porttitor eget posuere sed, hendrerit a tortor. Suspendisse molestie leo sollicitudin ullamcorper commodo. In rhoncus hendrerit accumsan.
Cras et leo nec diam volutpat egestas. Maecenas ac viverra dui. Aliquam nibh enim, lacinia sed ipsum sed, imperdiet sollicitudin dui. </p>
</article>
<article>
<a href="#Mozillalink.2"><h1>Mozilla Firefox</h1></a><br />
<p>Morbi eget urna lacinia, rutrum dolor ac, malesuada velit. Aliquam sit amet facilisis augue.
Pellentesque lorem purus, porttitor eget posuere sed, hendrerit a tortor. Suspendisse molestie leo sollicitudin ullamcorper commodo.
In rhoncus hendrerit accumsan. Cras et leo nec diam volutpat egestas. Maecenas ac viverra dui. Aliquam nibh enim, lacinia sed ipsum sed, imperdiet sollicitudin dui. </p>
</article>
<article>
<a href="#Edgelink.3"><h1>Microsoft Edge</h1></a><br />
<p>Microsoft Edge is a web browser developed by Microsoft. It was first released for Windows 10 and Xbox One in 2015, then for Android and iOS in 2017,[8][9] and macOS in 2019.[10]
Edge includes integration with Cortana and has extensions hosted on the Microsoft Store. Unlike Internet Explorer, Edge does not support the legacy ActiveX and BHO technologies. </p>
</article>
</body>甚至更短：
$("article").hide();
$("a").click(function() {
href = $(this).attr('href');
$("article a[href='" + href + "']").parent().show(2000).hide(3000);
})<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#Googlelink.1">Google Chrome</a> <br />
<a href="#Mozillalink.2">Mozilla Firefox</a> <br />
<a href="#Edgelink.3">Microsoft Edge</a> <br />
<article>
<a href="#Googlelink.1">
<h1>Google Chrome</h1>
</a><br />
<p>Morbi eget urna lacinia, rutrum dolor ac, malesuada velit. Aliquam sit amet facilisis augue. Pellentesque lorem purus, porttitor eget posuere sed, hendrerit a tortor. Suspendisse molestie leo sollicitudin ullamcorper commodo. In rhoncus hendrerit accumsan.
Cras et leo nec diam volutpat egestas. Maecenas ac viverra dui. Aliquam nibh enim, lacinia sed ipsum sed, imperdiet sollicitudin dui. </p>
</article>
<article>
<a href="#Mozillalink.2">
<h1>Mozilla Firefox</h1>
</a><br />
<p>Morbi eget urna lacinia, rutrum dolor ac, malesuada velit. Aliquam sit amet facilisis augue. Pellentesque lorem purus, porttitor eget posuere sed, hendrerit a tortor. Suspendisse molestie leo sollicitudin ullamcorper commodo. In rhoncus hendrerit accumsan.
Cras et leo nec diam volutpat egestas. Maecenas ac viverra dui. Aliquam nibh enim, lacinia sed ipsum sed, imperdiet sollicitudin dui. </p>
</article>
<article>
<a href="#Edgelink.3">
<h1>Microsoft Edge</h1>
</a><br />
<p>Microsoft Edge is a web browser developed by Microsoft. It was first released for Windows 10 and Xbox One in 2015, then for Android and iOS in 2017,[8][9] and macOS in 2019.[10] Edge includes integration with Cortana and has extensions hosted on the
Microsoft Store. Unlike Internet Explorer, Edge does not support the legacy ActiveX and BHO technologies. </p>
</article>$("article").hide();
$("a").click(function() {
href = $(this).attr('href');
$("article a[href='" + href + "']").parent().show(2000).hide(3000);
})