JavaScript를 사용하여 DIV를 표시하고 숨기려면 어떻게 해야 합니까?

JavaScript를 사용하여 'div' 표시/숨기기

웹 개발의 일반적인 작업은 페이지의 요소를 동적으로 표시하거나 숨기는 것입니다. 이는 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";

가시성 전환

ID가 "my_div"인 div의 가시성을 전환하려면 다음을 사용하십시오. 코드:

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

가시성 속성 사용

또는 가시성 속성을 사용하여 레이아웃에 영향을 주지 않고 요소를 숨길 수 있습니다. 가시성을 사용하여 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 중국어 웹사이트의 기타 관련 기사를 참조하세요!