<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>rsp_answer.html</title>
</head>
<body>
<table border="1">
<tr>
<td>User</td>
<td rowspan="2"><img src="images/win.png" width="100" id="result"></td>
<td>Computer</td>
</tr>
<tr>
<td><img src="images/rsp1.png" width="100" id="userImage"></td>
<td><img src="images/rsp3.png" width="100" id="comImage"></td>
</tr>
</table>
<script>
//사용자 입력
var userInput = prompt("가위 바위 보를 입력하세요");
var userNum = 0;
if (userInput == "가위") {
userNum = 1;
} else if (userInput =="바위"){
userNum = 2;
} else if (userInput == "보"){
userNum = 3;
} else {
usertext = prompt ("다시 정확히 입력하세요: 가위,바위,보")
}
console.log(userInput);
//컴퓨터가 3가지 중의 임의의 1개
var comNum = parseInt(Math.random() * 3) + 1; //1 ~ 3 랜덤수
var userImage = document.getElementById("userImage");
console.log(userImage);
var comImage = document.getElementById("comImage");
userImage.src = "images/rsp" + userNum + ".png";
comImage.src = "images/rsp" + comNum + ".png";
var elResult = document.getElementById("result");
if (userNum == comNum) {
console.log("비김");
elResult.src = "images/draw.png";
} else if(userNum == 1 && comNum == 2) {
console.log("짐");
elResult.src = "images/lose.png";
} else if(userNum == 1 && comNum == 3) {
console.log("이김");
elResult.src = "images/win.png";
} else if(userNum == 2 && comNum == 3) {
console.log("짐");
elResult.src = "images/lose.png";
} else if(userNum == 2 && comNum == 1) {
console.log("이김");
elResult.src = "images/win.png";
} else if(userNum == 3 && comNum == 1) {
console.log("짐");
elResult.src = "images/lose.png";
} else if(userNum == 3 && comNum == 2) {
console.log("이김");
elResult.src = "images/win.png";
}
</script>
</body>
</html>
'JavaScript > Vanilla JavaScript' 카테고리의 다른 글
입력한 수의 합계 구하기 (0) | 2023.09.11 |
---|---|
랜덤수 생성 (0) | 2023.09.11 |
간단한 inline Script (0) | 2023.09.11 |
댓글