如何使用按钮动态切换 Div 可见性？

使用按钮动态切换 Div 可见性

想要通过单击按钮无缝切换 div 元素的可见性？以下是如何实现它：

纯 JavaScript：

考虑以下 HTML 结构：

<code class="html"><div id="newpost"></div></code>

要使用纯 JavaScript 切换可见性，您可以使用：

<code class="js">var button = document.getElementById('button');

button.onclick = function() {
    var div = document.getElementById('newpost');
    if (div.style.display !== 'none') {
        div.style.display = 'none';
    }
    else {
        div.style.display = 'block';
    }
};</code>

jQuery：

凭借 jQuery 的简单性，您可以使用：

<code class="js">$("#button").click(function() { 
    $("#newpost").toggle();
});</code>

两种解决方案都允许您切换单击 ID 为“button”的按钮时“newpost”div 元素的可见性。每次单击按钮时，div 元素都会在“隐藏”和“可见”状态之间切换。

以上是如何使用按钮动态切换 Div 可见性？的详细内容。更多信息请关注PHP中文网其他相关文章！