Question

我试图使用随机生成的顶部和左侧位置附加图像以显示在左侧div中，并认为我的代码很好，但它不起作用，任何人都可以帮忙吗？调试时说

Uncaught SyntaxError：意外的标识符。
未捕获的ReferenceError：未定义generateFaces。

我很困惑为什么没有定义函数generateFaces。

＆＃13;

function generateFaces() {
  var numberOfFaces = 5;
  var theLeftSide = document.getElementById("leftSide");

  var  this_img  =  document.createElement("img");
  this_img.src = "smile.png";

  var  random_top  =  Math.random()  *  400;
  random_top  =  Math.floor(random_top);
  this_img.style.top = random_top + "px";

  var  random_left  =  Math.random()  *  400;
  random_left  =  Math.floor(random_left);
  this_img.style.left = random_left + "px";

  theLeftSide.appendChild(this_img);

}

＆＃13;

img {
  position: absolute;
}
div {
  position: absolute;
}
#leftSide {
  width: 500px;
  height: 500px;
}
#rightSide {
  width: 500px;
  height: 500px;
  left: 500px;
  border-left: 1px solid black;
}

＆＃13;

<!DOCTYPE html>
<html>
<head>
  <title>Matching Game!</title>
</head>

<body id="theBody" onload="generateFaces()">
  <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>

＆＃13;

Answer 1

显然，代码中有不可见的字符，通过在头部添加以下内容来解决：

<meta http-equiv="content-type" content="text/html"; charset = "UTF-8">

Answer 2

Zak的问题直接涉及香港科技大学“HTML，CSS和JavaScript”课程的第三个也是最后一个项目（匹配游戏）的实施。该项目的规格包括：

“创建函数generateFaces（）...在此函数中，面是循环创建的。循环执行numberOfFaces次...设置img src属性，以便使用适当的图像文件名，例如img。 src =“smile.png”...使用appendChild（）将新创建的图像添加到leftSide div。“

Answer 3

请检查here

我发现了你的错误。你只需使用另一个分号。

Javascript节点：将具有随机位置的图像附加到div元素

3 个答案: