반응형
[JavaScript] 자바스크립를 활용하여 숫자맞추기 게임 만들기 (up&down game)
아래 코드 사용하시면 숫자맞추기(up&down) 게임을 바로 하실 수 있습니다 ㅎ
예제코드
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>숫자 맞추기 게임</title>
</head>
<body>
<h1>숫자 맞추기 게임</h1>
<p>1부터 100 사이의 숫자를 맞춰보세요!</p>
<input type="number" id="userGuess" placeholder="숫자를 입력하세요">
<button onclick="checkGuess()">확인</button>
<p id="hint"></p>
</body>
</html>
<script>
let secretNumber = Math.floor(Math.random() * 100) + 1;
let attempts = 0;
function checkGuess() {
let userGuess = document.getElementById('userGuess').value;
attempts++;
if (userGuess < secretNumber) {
document.getElementById('hint').textContent = "입력한 숫자가 너무 작아요!";
} else if (userGuess > secretNumber) {
document.getElementById('hint').textContent = "입력한 숫자가 너무 커요!";
} else {
document.getElementById('hint').textContent = "정답입니다! " + attempts + "번만에 맞췄어요!";
// 게임 리셋 (선택사항)
secretNumber = Math.floor(Math.random() * 100) + 1;
attempts = 0;
}
}
</script>
결과값
728x90
반응형
'Coding > JavaScript' 카테고리의 다른 글
[JavaScript] 자바스크립를 활용하여 시간 지나면 자동 새로고침과 키보드 입력시 초기화 하는 방법 !! (0) | 2023.11.13 |
---|---|
[JavaScript] 자바스크립트로 초간단 미사일 피하기 게임 만들기 2 !! (0) | 2023.10.18 |
[JavaScript] 글자 타이핑 하는 효과 내는 방법 !! (Typed.js 라이브러리 활용) (0) | 2023.08.05 |
[JavaScript] 자바스크립를 활용하여 input 태그안에 value 넣는 방법 !! (0) | 2023.07.11 |
[JavaScript] 자바스크립와 CSS로 글자 입력효과 내는 방법 !! (0) | 2023.06.18 |
댓글