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

No:35266

←

Prev Next

→

ひよこカードゲーム
Developer おまめちゃん｜Date and time 24/1/13 18:31:45
Build time 14.531 sec｜Game capacity 3.701KB｜

Script

了解しました。以下に、ひよこカードゲームのプログラムを示します。
html

ひよこカードゲーム

このプログラムは、ひよこカードゲームを実装しています。ゲームが開始されると、「スタート」ボタンが表示され、クリックすることでゲームがスタートします。カードがランダムに配置され、プレイヤーはカードをクリックして内容を開くことができます。同じ内容のカードを2回連続で開けると、スコアが1加算されます。全てのカードを正しく開けるとゲームクリアとなり、トータルの試行回数が表示されます。以上が、ひよこカードゲームのプログラムです。スマートフォンのブラウザでこのHTMLファイルを開くと、実際にゲームを遊ぶことができます。

←

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>ひよこカードゲーム</title>
</head>
<body>
  <h1>ひよこカードゲーム</h1>
  <button id="startBtn">スタート</button>
  <div id="gameArea"></div>

// ゲームを開始する関数
      start: function() {
        this.shuffledCards = this.shuffle(this.cards);
        this.currentCard = null;
        this.score = 0;
        this.attempts = 0;
        this.render();
      },

// カードをシャッフルする関数
      shuffle: function(array) {
        let currentIndex = array.length, temporaryValue, randomIndex;

while (currentIndex !== 0) {
          randomIndex = Math.floor(Math.random() * currentIndex);
          currentIndex -= 1;
          temporaryValue = array[currentIndex];
          array[currentIndex] = array[randomIndex];
          array[randomIndex] = temporaryValue;
        }

return array;
      },

// クリック時の処理を行う関数
      handleClick: function(index) {
        if (!this.currentCard) {
          this.currentCard = this.shuffledCards[index];
          document.getElementById("card" + index).textContent = this.currentCard;
        } else {
          if (this.currentCard === this.shuffledCards[index]) {
            this.score++;
            if (this.score === this.cards.length / 2) {
              alert("ゲームクリア！ スコア: " + this.attempts);
            }
          } else {
            this.render();
          }
          this.currentCard = null;
          this.attempts++;
        }
      },

// ゲームの状態を表示する関数
      render: function() {
        const gameArea = document.getElementById("gameArea");
        gameArea.innerHTML = "";

for (let i = 0; i < this.shuffledCards.length; i++) {
          const card = document.createElement("div");
          card.textContent = "カード" + (i + 1);
          card.id = "card" + i;
          card.classList.add("card");
          card.addEventListener("click", () => this.handleClick(i));
          gameArea.appendChild(card);
        }
      }
    };

// スタートボタンをクリックした際の処理
    document.getElementById("startBtn").addEventListener("click", () => game.start());
  </script>

以上が、ひよこカードゲームのプログラムです。スマートフォンのブラウザでこのHTMLファイルを開くと、実際にゲームを遊ぶことができます。