下記が実装例です。
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>じゃんけんゲーム with 核ボタン</title>
</head>
<body>
<h1>じゃんけんゲーム with 核ボタン</h1>
<div id="playerHand">
<button onclick="playerHand('グー')">グー</button>
<button onclick="playerHand('チョキ')">チョキ</button>
<button onclick="playerHand('パー')">パー</button>
</div>
<div id="result"></div>
<button onclick="hakai()">核ボタン</button>
<script>
function playerHand(hand) {
const computerHand = computerChoice();
const result = judge(hand, computerHand);
const resultText = `あなた: ${hand}、コンピューター: ${computerHand}、${result}です！`;
document.querySelector('#result').textContent = resultText;
}
function computerChoice() {
const hands = ['グー', 'チョキ', 'パー'];
const randomIndex = Math.floor(Math.random() * hands.length);
return hands[randomIndex];
}
function judge(playerHand, computerHand) {
if (playerHand === computerHand) {
return 'あいこ';
} else if (
(playerHand === 'グー' && computerHand === 'チョキ') ||
(playerHand === 'チョキ' && computerHand === 'パー') ||
(playerHand === 'パー' && computerHand === 'グー')
) {
return '勝ち';
} else {
return '負け';
}
}
function hakai() {
const resultText = '核ボタンであなたとコンピューターの両方が負けました！';
document.querySelector('#result').textContent = resultText;
}
</script>
</body>
</html>
```
ジョークとして、じゃんけんゲームとは関係なく、ボタンをクリックするたびに「核が一発落ちる」と表示するようにしても面白そうです。ただし、現実の核開発や核戦争を笑い事にすることはできませんので、注意が必要です。
