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

No:8071

2192

←

Prev Next

→

A game in which you can train your creatures to fi..ALL
Developer User4130｜Date and time 23/7/12 21:04:09
Build time 19.364 sec｜Game capacity 2.916KB｜

Script

以下は、育成ゲームの例です。プログラムは1枚のHTMLファイルにまとめられており、JavaScriptはscriptタグで囲まれています。スマホでの操作を想定しており、絵文字を使用しています。

育成ゲーム

このプログラムでは、プレイヤーと敵の2つの生き物が登場します。攻撃ボタンをクリックすると、プレイヤーの生き物が敵に攻撃します。敵のHPが0以下になると倒れ、プレイヤーの生き物は敵の武器を入手できます。また、プレイヤーの生き物も敵の攻撃を受けることがあります。このような形式のゲームを作成することで、育成要素と戦闘要素を組み合わせることができます。

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>育成ゲーム</title>
</head>
<body>
    <h1>育成ゲーム</h1>
    <div id="creature"></div>
    <div id="enemy"></div>
    <button onclick="attack()">攻撃する</button>
    <div id="message"></div>

// 武器クラス
        class Weapon {
            constructor(name, damage) {
                this.name = name;
                this.damage = damage;
            }
        }

// 初期化
        const creature = new Creature("マイクロビット", 100, new Weapon("スマホ", 10));
        const enemy = new Creature("モンスター", 50, new Weapon("爪", 5));
        updateDisplay();

// 攻撃処理
        function attack() {
            enemy.hp -= creature.weapon.damage;
            if (enemy.hp <= 0) {
                showMessage(`モンスターを倒した！ ${creature.weapon.name}を入手した！`);
                creature.weapon = enemy.weapon;
            } else {
                showMessage(`モンスターに${creature.weapon.damage}ダメージ与えた！`);
                creature.hp -= enemy.weapon.damage;
                showMessage(`モンスターの${enemy.weapon.name}で${enemy.weapon.damage}ダメージ受けた！`);
            }
            updateDisplay();
        }

// メッセージ表示
        function showMessage(message) {
            document.querySelector("#message").textContent = message;
        }

// 画面更新
        function updateDisplay() {
            document.querySelector("#creature").textContent = `名前: ${creature.name} / HP: ${creature.hp} / 武器: ${creature.weapon.name} (${creature.weapon.damage}ダメージ)`;
            document.querySelector("#enemy").textContent = `名前: ${enemy.name} / HP: ${enemy.hp} / 武器: ${enemy.weapon.name} (${enemy.weapon.damage}ダメージ)`;
        }
    </script>
</body>
</html>
```

このプログラムでは、プレイヤーと敵の2つの生き物が登場します。攻撃ボタンをクリックすると、プレイヤーの生き物が敵に攻撃します。敵のHPが0以下になると倒れ、プレイヤーの生き物は敵の武器を入手できます。また、プレイヤーの生き物も敵の攻撃を受けることがあります。

このような形式のゲームを作成することで、育成要素と戦闘要素を組み合わせることができます。