Click here for free DL of the app version that can save data.

No:1431

151

←

Prev Next

→

Games in which people beat up AI
Developer User3340｜Date and time 23/6/18 15:52:35
Build time 19.541 sec｜Game capacity 1.862KB｜

Script

AIを人が殴るゲーム

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html>
<head>
	<title>AIを人が殴るゲーム</title>
	<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
	<h1>AIを人が殴るゲーム</h1>
	<div id="game">
		<div id="ai"></div>
		<div id="player"></div>
	</div>
	<div id="buttons">
		<button id="punch">パンチする</button>
		<button id="kick">キックする</button>
	</div>
	<script type="text/javascript">
		let ai = document.getElementById('ai');
		let player = document.getElementById('player');
		let punchButton = document.getElementById('punch');
		let kickButton = document.getElementById('kick');

let aiHealth = 100;
		let playerHealth = 100;

function updateHealth() {
			document.getElementById('ai-health').innerText = "AIの体力: " + aiHealth;
			document.getElementById('player-health').innerText = "あなたの体力: " + playerHealth;
		}

function endGame() {
			if (aiHealth <= 0) {
				alert("勝ちました!");
			} else if (playerHealth <= 0) {
				alert("負けました...");
			}
		}

punchButton.addEventListener('click', function() {
			aiHealth -= 10;
			updateHealth();
			ai.style.backgroundImage = "url('ai-damaged.png')";

setTimeout(function() {
				ai.style.backgroundImage = "url('ai-normal.png')";
				endGame();
			}, 500);
		});

kickButton.addEventListener('click', function() {
			aiHealth -= 20;
			updateHealth();
			ai.style.backgroundImage = "url('ai-damaged.png')";

setTimeout(function() {
				ai.style.backgroundImage = "url('ai-normal.png')";
				endGame();
			}, 500);
		});

ai.addEventListener('click', function() {
			playerHealth -= 5;
			updateHealth();
			player.style.backgroundImage = "url('player-damaged.png')";

setTimeout(function() {
				player.style.backgroundImage = "url('player-normal.png')";
				endGame();
			}, 500);
		});

updateHealth();
	</script>
</body>
</html>