불로구

자바스크립트 - 출력, prompt(), confirm(), alert() 본문

프로그래밍/JavaScript

자바스크립트 - 출력, prompt(), confirm(), alert()

맹이맹이 2020. 6. 17. 00:11
반응형

자바스크립트 HTML 출력

- 자바스크립트 코드를 HTML 콘텐츠를 웹 페이지에 사입하여 인터넷에 출력할 수 있다.

키워드

- document.write()

- document.writeln() // '\n'

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        document.write("<h1> 자바스크립트 </h2>");
        document.write("배워봅시다~ <br>");
        document.write("화이팅");
    </script>
</body>
</html>

prompt() - 프롬프트 다이얼로그

- 다이얼로그를 이용하여 사용자로부터 문자열을 입력받아 리턴한다.

- 메시지와 디폴트 입력값을 출력하며, 디폴트 입력값은 생략이 가능하다

- 아무 값도 입력되지 않으면 "" 리턴

- 취소나 강제로 닫으면 null 리턴

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let pro = prompt("이름이 뭔가?","홍길동"); //첫번째 사진
        //let pro = prompt("이름이 뭔가?",""); //두번째 사진
        document.write(pro);
    </script>
</body>
</html>

 

 

confrim() - 확인 다이얼로그

- 메시지와 확인/취소 버튼을 가진 다이얼로그 출력, 사용자가 확인을 누르면 true, 취소나 강제로 닫으면 false 리턴

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let con = confirm("사람입니까?");
        document.write(con);
    </script>
</body>
</html>

 

alert() - 경고 다이얼로그

- 단순 메시지 출력 다이얼로그

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        alert("오류가 생겼습니다");
    </script>
</body>
</html>

혹시나 궁금한 점은 댓글로 남겨주세요!

반응형
Comments