Question

我正在调整w3学校的这些代码，但代码在刷新页面时会显示内容，并在单击时折叠。我希望内容开始隐藏，只有当按钮被击中时才会发现。

<!DOCTYPE html>
<html>
<head>
<style>
#myDIV {
    width: 100%;
    padding: 50px 0;
    text-align: center;
    background-color: lightblue;
    margin-top:20px;
}
</style>
</head>
<body>

<p>Click the "Try it" button to toggle between hiding and showing the DIV     element:</p>

<button onclick="myFunction()">Try it</button>

<div id="myDIV">
This is my DIV element.
</div>

<p><b>Note:</b> The element will not take up any space when the display property set to "none".</p>

<script>
function myFunction() {
    var x = document.getElementById('myDIV');
    if (x.style.display === 'none') {
        x.style.display = 'block';
    } else {
        x.style.display = 'none';
    }
}
</script>

</body>
</html>

Answer 1

<div id="myDIV" style="display:none;">
   This is my DIV element.
</div>

切换按钮从关闭开始，而不是打开

1 个答案: