버튼 클릭으로 DIV 요소를 표시하고 숨기는 방법은 무엇입니까?

버튼을 사용하여 DIV의 표시 여부를 전환하는 방법은 무엇입니까?

많은 웹 애플리케이션에는 페이지에서 div와 같은 요소를 표시하거나 숨기는 기능이 필요합니다. 이는 JavaScript를 사용하여 쉽게 달성할 수 있습니다. 버튼을 사용하여 div의 가시성을 전환하는 방법은 다음과 같습니다.

순수 JavaScript:

이 접근 방식은 div 요소의 style.display 속성을 사용합니다. 버튼을 클릭하면 div가 현재 표시되는지(즉, style.display가 '없음'이 아님) 확인하는 클릭 이벤트 리스너가 트리거됩니다. 그렇다면 style.display를 'none'으로 설정하여 div를 숨깁니다. 그렇지 않으면 style.display를 'block'으로 설정하여 표시됩니다.

var button = document.getElementById('button'); // Assumes element with>

jQuery:

jQuery는 요소의 가시성을 전환하는 더 간단한 접근 방식을 제공합니다. . Toggle() 메서드는 선택한 요소의 가시성을 전환합니다. 클릭하면 클릭 이벤트 리스너가 ID가 'newpost'인 div에서 전환() 메서드를 트리거합니다.

$("#button").click(function() { 
    // assumes element with>

위 내용은 버튼 클릭으로 DIV 요소를 표시하고 숨기는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!