Wie schalte ich die Div-Sichtbarkeit dynamisch mit einer Schaltfläche um?

Div-Sichtbarkeit mit einem Knopf dynamisch umschalten

Möchten Sie die Sichtbarkeit eines Div-Elements mit einem Knopfdruck nahtlos umschalten? So erreichen Sie es:

Reines JavaScript:

Beachten Sie die folgende HTML-Struktur:

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

Um die Sichtbarkeit mit reinem JavaScript umzuschalten, Sie können Folgendes verwenden:

<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:

Mit der Einfachheit von jQuery können Sie Folgendes verwenden:

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

Mit beiden Lösungen können Sie umschalten die Sichtbarkeit des Div-Elements „newpost“, wenn auf die Schaltfläche mit der ID „button“ geklickt wird. Das div-Element wechselt mit jedem Tastenklick zwischen den Zuständen „versteckt“ und „sichtbar“.

Das obige ist der detaillierte Inhalt vonWie schalte ich die Div-Sichtbarkeit dynamisch mit einer Schaltfläche um?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!