Question

我正在制作匹配游戏，左右图像不同，用户必须找到（我在左侧再放一张图像）。我的问题是我无法在我想要的地方调用图像。我该怎么办？谢谢。

<!DOCTYPE html>
<html>

<head>
  <style>
    img {
      position: absolute;
    }
    div {
      position: absolute;
      width: 500px;
      height: 500px;
    }
    #leftside {
      float: left;
    }
    #rightside {
      float: right;
      left: 500px;
      border-left: 1px solid black
    }
  </style>
  <script>
    var numberOfFaces(5);
    var theLeftSide = document.getElementById("leftSide");

    function generateFaces() {
      var createElement("img");
      var position = Math.floor(Math.random() * 500);
      img.src = 'http://home.cse.ust.hk/~rossiter/mooc/matching_game/smile.png';
      img.id = 'smileImage';
      createElement.setAttribute("height", position);
      createElement.setAttribute("width", position);
      document.getElementById('leftSide').appendChild(img);
    }
  </script>
</head>

<body>
  <h1>Matching Game</h1>
  <p>Click on the extra smiling face on the left.</p>
  <div id="leftside"></div>
  <div id="rightside"></div>
</body>

</html>

Answer 1

您需要将内容设置为createElement('img')的结果。例如，您可以将该行更改为var img = createElement('img');

您实际上从未使用theLeftSide。

createElement实际上是document.createElement。

您从未定义变量createElement。由于我们之前称之为img，现在就这样做。

leftSide不是任何元素的ID，但leftside是。改变它以使所有用法都大写相同。

之后，您实际上需要致电generateFaces。由于页面是从上到下加载的，因此JavaScript尚未了解ID为div的{{1}}。您必须等到页面加载完毕才能调用Javascript，并且可以通过将leftSide添加到脚本的末尾来实现。

这是最终结果：

＆＃13;

window.onload = generateFaces

＆＃13;

使用javascript随机将图像放在div上

1 个答案: