Front-End/JavaScript

[JavaScript] 문법(6) 대화상자 함수

유자맛바나나 2021. 9. 27. 23:50

 대화상자 함수

javascript의 기본 대화상자 메서드 alert, prompt, confirm을 알아본다. 참고로 세가지 함수는 css로 스타일링이 불가하므로 html과 css로 별도의 대화상자를 구현하기도 한다. 디자인과 창의 위치는 브라우저를 따라가는 단점이 있지만 빠른 적용의 장점이 있다.

 

1. alert(): 알려준다

// 예시)

alert("안녕하세요");

alert 창

 

2. prompt(): 값을 입력 받는다

// 예시)

const name = prompt("이름을 입력하세요");
< 유자바나나 입력

console.log(name);
> 유자바나나

 

prompt 창을 띄울 때 기본 값을 입력해놓을 수 있다.

// 예시)

const name = prompt("예약일을 입력해주세요", "2021-09-");
< 10 입력

console.log(name);
> 2021-09-10

기본값을 입력한 prompt 창

3. confirm(): 확인 받는다 

확인 버튼을 누르면 true, 취소 버튼을 누르면 false를 반환한다.

// 예시)

const result = confirm("서울에 거주중이십니까?");

console.log(result);
> true or false

confirm 창

 

Reference

유튜브 코딩앙마 왕 초보 자바스크립트