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

No:7268

1657

Look for the emoji! There is one →😆 mixed in with ..ALL
Developer もちきなこ｜Date and time 23/7/6 18:22:39
Build time 24.435 sec｜Game capacity 3.434KB｜

はい、了解しました。以下が私の実装例です。

絵文字を探せ！

このプログラムでは、一つの HTML ファイルとして実装されています。JavaScript 部分は `script` タグで囲まれています。プログラムは実行するとゲームとして遊ぶことができます。ゲームの内容は、「絵文字を探せ！」というタイトルです。画面には「START」というボタンがあり、ボタンをクリックするとゲームが始まります。ゲームでは、レベルごとに絵文字が表示されます。表示された絵文字の中に、「😆」という絵文字が1つ紛れ込んでいます。プレイヤーの目標は、その絵文字を見つけることです。見つけると次のレベルへ進みます。全てのレベルをクリアすると「おめでとうございます！」というメッセージが表示されます。モバイルデバイスで操作することを前提としていますが、PC 上でも遊ぶことができます。また、絵文字を使用していますが、対応していない環境でも代替テキストが表示されるため、ゲームをプレイすることが可能です。

→ 　

1　

0　

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

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

(C)2023 HisashiApp

はい、了解しました。

以下が私の実装例です。

```html
<!DOCTYPE html>
<html lang="ja">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>絵文字を探せ！</title>
</head>

<body>
  <h1>絵文字を探せ！</h1>
  <button id="start-button">START</button>
  <div id="emoji-container"></div>

<script>
    var emojiContainer = document.getElementById("emoji-container");
    var startButton = document.getElementById("start-button");
    var emojis = ["😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀"];

function shuffle(emojis) {
      for (var i = emojis.length - 1; i > 0; i--) {
        var j = Math.floor(Math.random() * (i + 1));
        var temp = emojis[i];
        emojis[i] = emojis[j];
        emojis[j] = temp;
      }
      return emojis;
    }

function createEmojiGrid() {
      emojiContainer.innerHTML = "";
      shuffle(emojis);

for (var i = 0; i < emojis.length; i++) {
        var emoji = document.createElement("div");
        emoji.classList.add("emoji");
        emoji.textContent = emojis[i];
        emoji.addEventListener("click", checkEmoji);
        emojiContainer.appendChild(emoji);
      }
    }

function checkEmoji(event) {
      if (event.target.textContent === "😆") {
        alert("😆 を見つけました！次のレベルへ進みましょう！");
        emojis.splice(emojis.indexOf("😆"), 1);
        if (emojis.length > 0) {
          createEmojiGrid();
        } else {
          alert("おめでとうございます！全てのレベルをクリアしました！");
          emojiContainer.innerHTML = "";
          startButton.disabled = false;
        }
      } else {
        alert("😆 ではありません！もう一度探してみましょう！");
      }
    }

startButton.addEventListener("click", function() {
      emojis = ["😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀", "😀"];
      startButton.disabled = true;
      createEmojiGrid();
    });
  </script>
</body>

</html>
```

このプログラムでは、一つの HTML ファイルとして実装されています。JavaScript 部分は `script` タグで囲まれています。プログラムは実行するとゲームとして遊ぶことができます。

ゲームの内容は、「絵文字を探せ！」というタイトルです。画面には「START」というボタンがあり、ボタンをクリックするとゲームが始まります。ゲームでは、レベルごとに絵文字が表示されます。表示された絵文字の中に、「😆」という絵文字が1つ紛れ込んでいます。プレイヤーの目標は、その絵文字を見つけることです。見つけると次のレベルへ進みます。全てのレベルをクリアすると「おめでとうございます！」というメッセージが表示されます。

モバイルデバイスで操作することを前提としていますが、PC 上でも遊ぶことができます。また、絵文字を使用していますが、対応していない環境でも代替テキストが表示されるため、ゲームをプレイすることが可能です。