// 메시지 박스, 대화 상자(Dialog Box)
1. void alert(message): 메시지 전달용
2. boolean confirm(message): : 메시지 전달용(선택)
-----------------------------
3. string prompt(message, value):
- alert
<!DOCTYPE html>
<html lang="en">
<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>Document</title>
</head>
<body>
<form name="form1">
<input type="button" name="btn1" value="버튼1">
<input type="button" name="btn2" value="버튼2">
<input type="button" name="btn3" value="버튼3">
</form>
<script>
document.form1.btn1.onclick = m1;
function m1() {
// alert();
// alert(100);
alert('문자열');
}
</script>
</body>
</html>- confirm
<!DOCTYPE html>
<html lang="en">
<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>Document</title>
</head>
<body>
<form name="form1">
<input type="button" name="btn1" value="버튼1">
<input type="button" name="btn2" value="버튼2">
<input type="button" name="btn3" value="버튼3">
</form>
<script>
document.form1.btn2.onclick = m2;
function m2() {
if(confirm('정말 삭제하시겠습니까?')) {
document.body.bgColor = 'blue';
} else {
document.body.bgColor = 'white';
}
}
</script>
</body>
</html>- prompt
<!DOCTYPE html>
<html lang="en">
<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>Document</title>
</head>
<body>
<form name="form1">
<input type="button" name="btn1" value="버튼1">
<input type="button" name="btn2" value="버튼2">
<input type="button" name="btn3" value="버튼3">
</form>
<script>
document.form1.btn3.onclick = m3;
function m3() {
var input = prompt('이름을 입력하시오.', '');
console.log(input);
}
</script>
</body>
</html>
'클라이언트 > JavaScript' 카테고리의 다른 글
| [자바스크립트(JavaScript)] DOM (0) | 2023.04.26 |
|---|---|
| [자바스크립트(JavaScript)] 타이머 (0) | 2023.04.25 |
| [자바스크립트(JavaScript)] Collection (0) | 2023.04.24 |
| [자바스크립트(JavaScript)] BOM(Window, Screen, Location, History) (0) | 2023.04.24 |
| HTML 속성 제어(태그 조작) (0) | 2023.04.21 |
