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

No:6901

170

←

Prev Next

→

Three Kingdoms 21st Century
Developer User3884｜Date and time 23/7/4 6:16:08
Build time 39.84 sec｜Game capacity 3.287KB｜

Script

了解です。以下に、三国志を題材にしたシンプルな対戦型ゲームのサンプルプログラムを示します。

三国志21世紀

このプログラムでは、プレイヤー1とプレイヤー2が劉備、曹操、孫権のいずれかを選択して対戦します。プレイヤーの選択はボタンで行い、結果は画面上に表示されます。対戦結果は勝敗に応じて「プレイヤー1の勝利」、「プレイヤー2の勝利」、「引き分け」と表示されます。なお、スマホにも対応するため、ボタンのレイアウトはCSSで調整しています。また、絵文字の利用に関してはブラウザやデバイスによって表示が異なるため、今回は控えています。

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

了解です。以下に、三国志を題材にしたシンプルな対戦型ゲームのサンプルプログラムを示します。

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>三国志21世紀</title>
  <style>
    body {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      height: 100vh;
      font-family: Arial, sans-serif;
    }
    h1 {
      font-size: 2em;
      margin-bottom: 1em;
    }
    button {
      padding: 0.5em 1em;
      font-size: 1em;
      margin-bottom: 1em;
    }
  </style>
</head>
<body>
  <h1>三国志21世紀</h1>
  <button id="player1">プレイヤー1</button>
  <button id="player2">プレイヤー2</button>
  <p id="result"></p>

// プレイヤーの選択肢をシャッフルする関数
    function shuffleChoices() {
      for (let i = playerChoices.length - 1; i > 0; i--) {
        const j = Math.floor(Math.random() * (i + 1));
        [playerChoices[i], playerChoices[j]] = [playerChoices[j], playerChoices[i]];
      }
    }

// プレイヤー2の選択をランダムで決定する関数
    function makeOpponentChoice() {
      return playerChoices[Math.floor(Math.random() * playerChoices.length)];
    }

// 対戦結果を判定する関数
    function judgeResult(playerChoice, opponentChoice) {
      if (playerChoice === opponentChoice) {
        return "引き分け";
      } else if (
        (playerChoice === '劉備' && opponentChoice === '曹操') ||
        (playerChoice === '曹操' && opponentChoice === '孫権') ||
        (playerChoice === '孫権' && opponentChoice === '劉備')
      ) {
        return "プレイヤー1の勝利";
      } else {
        return "プレイヤー2の勝利";
      }
    }

// ボタンクリック時の処理
    function handleClick(event) {
      const playerChoice = event.target.innerText;
      const opponentChoice = makeOpponentChoice();
      const result = judgeResult(playerChoice, opponentChoice);

document.getElementById('result').innerText = `プレイヤー1: ${playerChoice}、プレイヤー2: ${opponentChoice}、結果: ${result}`;
    }

// プレイヤー1とプレイヤー2のボタンにクリックイベントを追加
    document.getElementById('player1').addEventListener('click', handleClick);
    document.getElementById('player2').addEventListener('click', handleClick);

// 初回実行時に選択肢をシャッフル
    shuffleChoices();
  </script>
</body>
</html>
```

このプログラムでは、プレイヤー1とプレイヤー2が劉備、曹操、孫権のいずれかを選択して対戦します。プレイヤーの選択はボタンで行い、結果は画面上に表示されます。対戦結果は勝敗に応じて「プレイヤー1の勝利」、「プレイヤー2の勝利」、「引き分け」と表示されます。

なお、スマホにも対応するため、ボタンのレイアウトはCSSで調整しています。また、絵文字の利用に関してはブラウザやデバイスによって表示が異なるため、今回は控えています。