Computer >> 컴퓨터 >  >> 프로그래밍 >> JavaScript

자바스크립트(JavaScript) 경고 상자(Alert Box)란? 개념부터 예제까지

JavaScript 경고 상자(Alert Box)란?

경고 대화 상자(alert dialog box)는 주로 사용자에게 경고 메시지를 전달하는 데 사용됩니다. 예를 들어, 특정 입력 필드에 텍스트 입력이 필수인데 사용자가 아무 값도 입력하지 않았다면, 유효성 검사(validation) 과정의 일부로 경고 상자를 띄워 사용자에게 알릴 수 있습니다.

다만 경고 상자가 반드시 '경고'만을 위한 것은 아닙니다. 친근한 안내 문구나 간단한 정보를 전달하는 용도로도 충분히 활용할 수 있습니다.

경고 상자의 주요 특징

  • 단일 버튼: 경고 상자에는 "확인(OK)" 버튼 하나만 제공되며, 사용자는 이 버튼을 클릭해야만 다음 단계로 진행할 수 있습니다.
  • 모달(Modal) 방식: 확인 버튼을 누르기 전까지 페이지의 다른 작업이 일시적으로 차단됩니다.
  • 간편한 호출: window.alert()의 축약형인 alert()만으로도 어디서든 손쉽게 호출할 수 있습니다.

예제 코드

아래 코드를 실행하고 버튼을 클릭하면, 경고 상자가 나타나는 모습을 직접 확인할 수 있습니다.

<html>
    <head>
        <script>
            <!--
                function Warn() {
                    alert ("경고 메시지입니다!");
                    document.write ("경고 메시지입니다!");
                }
            //-->
        </script>
    </head>
    <body>
        <p>아래 버튼을 클릭하면 결과를 확인할 수 있습니다.</p>
        <form>
            <input type="button" value="클릭하세요" onclick="Warn();" />
        </form>
    </body>
</html>