Bagaimanakah Saya Boleh Menunjukkan dan Menyembunyikan DIV Menggunakan JavaScript?

Tunjukkan/sembunyikan 'div' menggunakan JavaScript

Tugas biasa dalam pembangunan web adalah untuk memaparkan atau menyembunyikan elemen pada halaman secara dinamik. Ini boleh dicapai menggunakan JavaScript untuk memanipulasi sifat gaya elemen.

Menyembunyikan Div Tunggal

Untuk menyembunyikan satu div dengan ID "my_div", gunakan yang berikut kod:

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

Menunjukkan yang Tersembunyi Div

Untuk menunjukkan div tersembunyi dengan ID "my_div", gunakan kod berikut:

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

Menogol Keterlihatan

Untuk menogol keterlihatan div dengan ID "my_div", gunakan yang berikut kod:

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

Menggunakan Sifat Keterlihatan

Sebagai alternatif, sifat keterlihatan boleh digunakan untuk menyembunyikan unsur tanpa menjejaskan reka letaknya. Untuk menyembunyikan div menggunakan keterlihatan, gunakan kod berikut:

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

Untuk menunjukkan div tersembunyi menggunakan keterlihatan, gunakan kod berikut:

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

Menyembunyikan Koleksi Elemen

Untuk menyembunyikan berbilang elemen, gunakan gelung untuk mengulanginya dan tetapkan paparan atau keterlihatannya kepada "tiada":

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

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menunjukkan dan Menyembunyikan DIV Menggunakan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!