본문 바로가기

javascript

javascript로 button 만들어서 열고 닫기 만들기

html 내용 div로 만들어 놓기

<div class="alert-box" id="alert-box">알림창임</div>
<button onclick="자바스크립트1()">버튼</button>
<button onclick="자바스크립트2()">닫기</button>

 

script로 간단하게 만들기

 function 자바스크립트1(){
            document.getElementById("alert-box").style.display = "block";
        }

         function 자바스크립트2(){
            document.getElementById("alert-box").style.display = "none";
        }

 

원하는 걸 onclick=" "  안에 넣어주기!

 

 

보여주기

css 속성을 none -> block 으로 변경

 

닫기

css 속성을 block-> none 으로 변경

 

*** 즉 함수는 긴 코드를 짧게 만들어 편리하게 쓰게 해주는 것이다.

반응형