使用JavaScript访问div的子节点

Question

我使用以下代码创建了一个div ...

var bannerBox = document.createElement("div");
bannerBox.id = "bannerBox";

...以及下面的第二个div ...

var bannerAd = document.createElement("div");
bannerAd.className = "bannerAd";

以上div是在一个函数中创建的。 现在在另一个函数中，我尝试按如下方式访问第一个div ...

var allAds = document.getElementById("bannerBox").childNodes; 

...但会产生此错误： 未捕获的错误无法读取null的属性子节点

Answer 1

您实际上必须将bannerBox div放入文档中，方法是将它传递到appendChild或insertBefore到文档中某些元素上（例如document.body ）：

document.body.appendChild(bannerBox);

（但是它可以是文档中的任何元素，不必是body 。）

将其放入文档后，您可以按照显示的方式通过id对其进行检索。

当然（这不是您遇到的问题，但这可能是下一个问题），对于bannerBox具有任何子节点（例如，对于childNodes不要将其作为空NodeList ），您需要在其中放置一些内容。 从您的变量名来看，我想您可能想将bannerAd放入其中，例如：

bannerBox.appendChild(bannerAd);