Javascript 在单击按钮之前，如何隐藏div？

我试图创建3个在页面加载时隐藏的div，这样当我单击它们各自的按钮时，它们就会显示出来，但是，无论我做什么，我都无法让它们在单击按钮时显示出来

以下是守则的相关部分：

我的div和按钮：

<button onclick="TestsFunction()">Tests</button>

<div id="TestsDiv" style="display:none">
    tests here!
</div>

我可以在加载页面时成功隐藏div，但是单击按钮后，它不会再次显示

我试过了

window.onload = function(){
    document.getElementById('TestsDiv').style.display = 'none';
}

而不是在div上显示style=“display:none”，以查看我隐藏它的方式是否有问题，但div仍然不会显示

---

我是一个初学者，我不擅长JS、HTML或PHP，如果可能的话，有人能帮我解释一下我的错误吗？我的代码中还需要其他东西吗？我试着阅读类似的文章，但解决方案太复杂了，我无法理解，最终无法解决我的问题。谢谢大家!

单击按钮时，您需要将显示设置为

块

（或其他内容），而不是

隐藏

函数TestsFunction（）{
var T=document.getElementById（“TestsDiv”）；
T.style.display=“block”//您需要调整您的函数以切换div的显示。当前它只是隐藏它-但如果它已经隐藏，请删除
display=“none”
以再次显示它。您可以通过将
显示
样式设置为空字符串（这使其成为默认设置）来删除它


函数TestsFunction（）{
var T=document.getElementById（“TestsDiv”），
displayValue=“”；
如果（T.style.display==“”）
displayValue=“无”；
T.style.display=显示值；
}
测试
这里有考试！
试试看


function TestsFunction（）{TestsDiv.style.display='block'}
测试
这里有考试！
您应该研究jQuery的hide（）和show（）方法。它们负责为您设置样式

像这样做=>

function TestsFunction(){
$("#TestsDiv").css("display","block")
}

在此之前，您应该包括jquery cdn。
谢谢。
T.style.display=“无”
应该是
T.style.display=“”；
因为我只想在单击按钮后显示它们，所以我觉得没有理由切换。我的目标是用户不需要重新单击来隐藏它，只需单击另一个按钮。我发现，在我的情况下，错误在于使用display=“none”而不是display=“block”在函数中，我将考虑设置的切换选项，如果我包含它们，虽然，谢谢！好吧，足够公平！）-只要你得到你所需要的！你不需要设置<代码>显示=“块”
，您只需通过设置空字符串将其设置为默认值即可。这是可行的，但包含jQuery只是为了干扰某些CSS是不必要的函数TestsFunction（）{document.getElementById（“TestsDiv”）.style.display=“block”}您可以尝试一下。如果这个答案有效，请标记为正确答案。谢谢
function TestsFunction() { TestsDiv.style.display = 'block' }

function TestsFunction(){
$("#TestsDiv").css("display","block")
}