JavaScript を使用して DIV を表示および非表示にするにはどうすればよいですか?

JavaScript を使用して 'div' を表示/非表示にする

Web 開発における一般的なタスクは、ページ上の要素を動的に表示または非表示にすることです。これは、JavaScript を使用して要素のスタイル プロパティを操作することで実現できます。

単一 Div の非表示

ID が「my_div」の単一 Div を非表示にするには、次のコマンドを使用します。コード:

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

非表示の表示Div

ID「my_div」の非表示の div を表示するには、次のコードを使用します:

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

Toggling Visibility

ID「my_div」の div の可視性を切り替えるには、次のコマンドを使用します。 code:

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

Visibility プロパティの使用

また、visibility プロパティを使用して、レイアウトに影響を与えることなく要素を非表示にすることもできます。可視性を使用して div を非表示にするには、次のコードを使用します。

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

可視性を使用して非表示の div を表示するには、次のコードを使用します。

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

コレクションの非表示要素

複数の要素を非表示にするには、ループを使用して要素を反復処理し、その表示または可視性を次のように設定します。 "なし":

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

以上がJavaScript を使用して DIV を表示および非表示にするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。