超能力ゲーム
1から5までの数字から選んで、正解を当ててください。
3回のチャンスがあります。
※本アプリは真剣な超能力調査ではありません。
以下は超能力をテーマとした単純なゲームの実装例です。セキュリティ上のリスクを最小限に抑えるよう注意しています。
```
<!DOCTYPE html>
<html>
<head>
<title>超能力ゲーム</title>
<style type="text/css">
body {
text-align: center;
margin-top: 50px;
font-size: 24px;
}
button {
font-size: 18px;
padding: 10px 20px;
background-color: #4CAF50;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
}
button:hover {
background-color: #3e8e41;
}
</style>
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function() {
var targetIndex = Math.floor(Math.random() * 6);
var attemptsLeft = 3;
document.getElementById("target-index").value = targetIndex;
document.getElementById("guess-button").addEventListener("click", function() {
var guessIndex = parseInt(document.getElementById("guess-index").value);
if (guessIndex === targetIndex) {
document.getElementById("result-message").innerHTML = "正解！あなたは超能力を持っています！";
document.getElementById("replay-button").style.display = "block";
document.getElementById("guess-button").style.display = "none";
} else {
attemptsLeft--;
if (attemptsLeft === 0) {
document.getElementById("result-message").innerHTML = "3回のチャンスを使い果たしました。ターゲットは" + targetIndex + "でした。";
document.getElementById("replay-button").style.display = "block";
document.getElementById("guess-button").style.display = "none";
} else {
document.getElementById("result-message").innerHTML = "残り" + attemptsLeft + "回のチャンスがあります。";
}
}
});
document.getElementById("replay-button").addEventListener("click", function() {
window.showToast("再読み込みしてください");
});
});
</script>
</head>
<body>
<h1>超能力ゲーム</h1>
<p>1から5までの数字から選んで、正解を当ててください。</p>
<p>3回のチャンスがあります。</p>
<p id="result-message"></p>
<input type="hidden" id="target-index" value="">
<input type="number" id="guess-index" min="1" max="5">
<button id="guess-button">予想する</button>
<button id="replay-button" style="display:none;">再挑戦する</button>
<p>※本アプリは真剣な超能力調査ではありません。</p>
</body>
</html>
```
上記のコードでは、ランダムな数値をターゲットとして設定し、3回以内にターゲットを当てるゲームです。各要素には適切なIDが設定されており、JavaScriptでそれぞれの要素にアクセスして操作します。また、ボタンを押した際の動作はイベントリスナーで処理されます。
面白いジョークを追加しました。