1

在我的 HTML 中，我有一个部分，其中有 JavaScript，它添加了一个运行我的游戏的事件侦听器：

<div class="content">
<script>
        window.addEventListener('load', Game.start);
</script>
</div>

如何使 JavaScript 包含在它上面的 div 中？当它显示时，游戏完全在它之外。

我正在使用crafty.js 框架。此处的文档：http: //craftyjs.com/api/

4

3 回答 3

2

不确定是什么Game.start。但是，脚本不需要位于容器元素中。你可以简单地拥有这样的东西：

<html>
  <head>
    <script>
      // here some library that defines `Game.start`
      window.addEventListener('load', Game.start);
    </script>
  </head>
  <body>
    <div class="content" id="game-container"></div>
  </body>
</html>

在里面Game.start你必须使用document.getElementById("game-container")以获得对你需要的元素的引用，然后使用它来添加你想要的节点。

于 2013-04-06T01:42:02.740 回答
1

您需要为该 Div 提供一个 ID，然后修改 javascript 以将对象加载到您的 div 的 id 中。

于 2013-04-06T01:42:32.383 回答
1

正如其中一条评论所提到的，id 为“cr-stage”的 div 对crafty.js 很重要。但是，您实际上不必包含它。如果您不使用它，它将自动创建。

<html>
  <head>
    <!-- this is the crafty.js library, which you could load from another server -->
    <script src="crafty.js"></script>

    <!-- this is the script where all your game's JS goes -->
    <script src="mygame.js"></script>

    <script>
      window.addEventListener('load', Game.start);
    </script>
  </head>
  <body>
  </body>
</html>

如果您使用上述方法，您将获得为您创建的 cr-stage id。

可能与您的问题相关的另一件事是，如果您想将 cr-stage 居中并移除一个自动出现在其上方的小间隙。为此，请使用以下代码：

<html>
  <head>
    <!-- this is the crafty.js library, which you could load from another server -->
    <script src="crafty.js"></script>

    <!-- this is the script where all your game's JS goes -->
    <script src="mygame.js"></script>

    <script>
      window.addEventListener('load', Game.start);
    </script>

    <style type="text/css">
      /* remove the small gap at the top */
      body { margin-top: 0 }

      /* horizontally center your stage on the page */
      #cr-stage { margin: 0 auto 0 }
    </style>
  </head>
  <body>
  </body>
</html>
于 2013-05-28T20:36:18.533 回答