javascript - 显示/隐藏点击

我有一个空间和两个正文要显示。我在此区域上方有两个“超链接”，希望使用它们来显示/隐藏下面的文本。第一次加载页面时，除了这两个链接之外，将不会显示任何内容。单击一个链接时，它将显示文本正文。单击另一个链接时，它将隐藏前一正文文本并显示新文本。只有两个超链接，但我希望用户能够在方便的时候来回切换。这可能吗？以前我使用javascript来取消隐藏文本，因为它们位于两个不同的区域。我不太擅长写代码。我发现关于这个主题的其他一些答案很有用，但大多数都使用按钮和点击监听器。有没有办法使用超链接来实现这一点？非常感谢代码示例！

最佳答案

你可以在CSS中定义一个类，上面写着“不要在这里显示文本”，然后使用超链接中的JS点击来切换元素的类？
因此，您的html将包含：

<a onclick="showText('text1','text2')" href="javascript:void(0);">Show Text 1</a>
<div id="text1" class="hide"> text1 </div>
<a onclick="showText('text2','text1')" href="javascript:void(0);">Show Text 2</a>
<div id="text2" class="hide"> text2 </div>

您的CSS将包含：

div.hide { display:none; [your properties]; }
div.show { [your properties]; }

你的JS看起来像这样：

function showText(show,hide)
{
    document.getElementById(show).className = "show";
    document.getElementById(hide).className = "hide";
}

这有帮助吗？