javascript - 未捕获的 NotFoundError : Failed to execute 'insertBefore' on 'Node' : The node before which the new node is to be inserted is not a child of this node

Question

我在使用 JavaScript 时遇到问题。我收到此错误消息:

Uncaught NotFoundError: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node.

Javascript:

var vidCounter = 0;
vidCounter++;

var originalDiv;
var newVideo = document.createElement("video");

newVideo.setAttribute("name", vidCounter);
newVideo.setAttribute("autoplay", "true");
originalDiv = document.getElementById("othersarea");
document.body.insertBefore(newVideo, originalDiv); 

它正在尝试添加 <video>在名为 othersarea 的 div 下方标记.

<div id="remoteVideos">
  <div class="title">
    <h2>Others</h2>
  </div>
  <div id="othersarea"></div>
</div>

我该如何解决这个问题？

我也想跑attachMediaStream([VIDEO TAG HERE HOW?], event.stream);在我的新视频标签上。

Answer 1

您必须在之前插入的元素的父元素上调用 insertBefore。 document.body 不是父级，它位于 DOM 层次结构的最上层。

要在 DIV 之后插入，您必须在其下一个同级之前插入。

var parentDiv = document.getElementById("remoteVideos");
parentDiv.insertBefore(newVideo, originalDiv.nextSibling);

请参阅 MDN 中的示例