사용자와 커뮤니케이션 하기

HTML은 form을 통해서 사용자와 커뮤니케이션할 수 있는 기능을 제공한다. 자바스크립트에는 사용자와 정보를 주고 받을 수 있는 간편한 수단을 제공한다.

alert(경고창)

  • 사용자에게 정보를 제공하거나 경고를 하는데 사용

  • 자바스크립트를 실행중에는 다음 코드를 진행하지 않

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title></title>
</head>
<body>
  <!--  클릭시 경고창  -->
  <input type="button" value="alert" onclick="alert('hello world');">
</body>
</html>

confirm

  • 확인을 누르면 true, 취소를 누르면 false를 리턴

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title></title>
</head>
<body>
  <input type="button" value="confirm" onClick="func_confirm()" />
  
  <script>
    function func_confirm() {
      if(confirm('ok??')) {
        alert('ok');
      } else {
        alert('cancel');
      }
    }
  </script>
</body>
</html>

prompt

  • 사용자의 입력을 받아서 자바스크립트에서 사용할 수 있게 해주는 함수

  • 사용자 입력값 반환

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title></title>
</head>
<body>
  <input type="button" value="prompt" onclick="func_prompt()" />
  
  <script>
    // 사용자가 입력한 값을 버튼에 삽
    function func_prompt() {
      var answer = prompt('button value : ');
      
      document.querySelector('input').value = answer;
    }
  </script>
</body>
</html>

PreviousWindow 객체NextLocation 객체

Last updated

Was this helpful?