Coding/Javascript

Alert 창 만들기

민톨이 2024. 3. 1. 18:17
728x90

Window.alert()

-확인 버튼을 가지며 메시지를 지정할 수 있는 경고 대화 상자를 띄우는 메서드

 

구문

-window.alert([message]);

 

Alert UI만드는 법

- 미리 디자인 해놓고 숨김(display:none) - css로

- 버튼 누르면 보여줌 (버튼 누를 시 display:block 으로 바뀌게 함)

 

예제1 

<body>

  <div class="hello-box" id="hello">Hello box</div>
  <button onclick="document.getElementById('hello').style.display = 'block';">버튼</button>

</body>

 

=> id가 hello인 요소 가져와서 display 속성을 block으로 변경

 

예제2

<button onclick="document.getElementById('hello').style.display = 'none';">닫기 버튼</button>

 

=> 닫기 버튼 만들기

'Coding > Javascript' 카테고리의 다른 글

addEventListener 이벤트리스너 ('click' 사용해보기)  (0) 2024.03.03
alert박스와 function()함수 콜라보  (0) 2024.03.03
function 함수  (0) 2024.03.01
Js - Selector  (0) 2024.03.01
ES5/ES6 차이  (0) 2024.03.01