Wie kann ich DIVs mit JavaScript ein- und ausblenden?

„div“ mithilfe von JavaScript anzeigen/verbergen

Eine häufige Aufgabe in der Webentwicklung besteht darin, Elemente auf der Seite dynamisch anzuzeigen oder auszublenden. Dies kann mithilfe von JavaScript erreicht werden, um die Stileigenschaften des Elements zu manipulieren.

Ausblenden eines einzelnen Div

Um ein einzelnes Div mit der ID „my_div“ auszublenden, verwenden Sie Folgendes Code:

document.getElementById("my_div").style.display = "none";

Verstecktes Div anzeigen

Zum Anzeigen Um ein verstecktes Div mit der ID „my_div“ zu erstellen, verwenden Sie den folgenden Code:

document.getElementById("my_div").style.display = "block";

Sichtbarkeit umschalten

Um die Sichtbarkeit eines Divs mit der ID „my_div“ umzuschalten ", verwenden Sie den folgenden Code:

var div = document.getElementById("my_div");
if (div.style.display == "none") {
  div.style.display = "block";
} else {
  div.style.display = "none";
}

Verwenden der Sichtbarkeit Eigenschaft

Alternativ kann die Sichtbarkeitseigenschaft verwendet werden, um Elemente auszublenden, ohne deren Layout zu beeinflussen. Um ein Div mithilfe der Sichtbarkeit auszublenden, verwenden Sie den folgenden Code:

document.getElementById("my_div").style.visibility = "hidden";

Um ein ausgeblendetes Div mithilfe der Sichtbarkeit anzuzeigen, verwenden Sie den folgenden Code:

document.getElementById("my_div").style.visibility = "visible";

Ausblenden einer Sammlung von Elemente

Um mehrere Elemente auszublenden, verwenden Sie eine Schleife, um sie zu durchlaufen und ihre Anzeige oder Sichtbarkeit auf festzulegen „keine“:

var elements = document.querySelectorAll(".my_class");
for (var i = 0; i < elements.length; i++) {
  elements[i].style.display = "none";
}

Das obige ist der detaillierte Inhalt vonWie kann ich DIVs mit JavaScript ein- und ausblenden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!