Question

我有一个任务是让几个bug随机地在屏幕上飞行，但是我在通过javascript将div添加到html主体时遇到了问题。

<head>
<title>Fly little bug! Fly!</title>

<script type="text/javascript">
/* <![CDATA[ */
var numBugs = 0;
var body = document.getElementsByTagName("body");
function bug(startX, startY, xSpeed, ySpeed){
  var self = this;
  this.xPos = startX;
  this.yPos = startY;
  this.xSpeed = xSpeed;
  this.ySpeed = ySpeed;
  this.divId = "bug" + numBugs;

  this.div = document.createElement("div");

  this.div.innerHTML = "test";

  body.appendChild(self.div);

  this.fly = function(){
    self.xPos += self.xSpeed;
    self.yPos += self.ySpeed;
  }
  this.fly();
  this.flyInterval = setInterval(function(){ self.fly(); },5000);
  numBugs++;
}

/* ]]> */
</script>
</head>

<body onload = "var bug1 = new bug(10, 20, 5, 3);">

</body>
</html>

Answer 1

我可以看到两个问题。

getElementsByTagName函数返回一个元素数组。你必须明确表示你想要数组的第一个元素。
```
var body = document.getElementsByTagName("body")[0];
```
你基本上是在说“给我''body'类型文件中的所有标签”。它为您提供了一个标签列表，即使在任何HTML文档中只应该有一个“正文”，您也必须得到第一个标签。上面代码中的[0]为您提供了第一个。
您正在尝试在创建之前访问正文。＆lt; script＆gt;发生在＆lt; body＆gt;之前的文档中标记，所以在执行脚本时，正文不存在。你需要在bug（）函数中调用getElementsByTagName。

Answer 2

document.body.innerHTML += '<div>Div Content</div>';

如果你想让自己更容易进行简单的DOM操作，请查看jQuery。

使用javascript附加到正文

2 个答案: