html - 我在网页内developers.mozilla.org的猜谜游戏中放置重置按钮时遇到问题，因为它放置错误

Question

我已经开始学习 JavaScript，并且正在阅读https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/A_first_splash上的猜谜游戏教程，并希望将猜谜游戏整合到网络中页面查看如何在 div 容器中运行游戏。一切正常，直到游戏结束或游戏获胜并且“开始新游戏”按钮出现并且 document.body.appendchild(resetButton); 被执行。

该按钮位于页脚之后的页面末尾，而不是 div 容器内。我做错了什么，我可以查看什么来更改代码以使其出现在容器底部的“输入猜测”栏下，如示例中所示？

在示例中，所有内容都在 body 标签下，但我在页面下创建了一个运行游戏。

我也尝试过运行 document.body.append(resetButton); 甚至将 .body 更改为 document.div.appendchild(resetButton); 代码以查看我是否可以将其放置在正确的位置。当我更改 .body 代码时，它会给我一个未定义的附加错误。

Answer 1

我认为您可以使用insertAdjacentElement方法，它允许您定义插入位置。

它接受这些值：

'beforebegin'：在 targetElement 本身之前。

'afterbegin'：就在 targetElement 内部，在它的第一个子元素之前。

'beforeend'：就在 targetElement 内部，在它的最后一个子元素之后。

'afterend'：在 targetElement 本身之后。

---

例子：

document.body.insertAdjacentElement('afterbegin', element);