javascript - 使用 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; 

...但它会产生此错误: Uncaught Error 无法读取 null 的属性子节点

Answer 1

您必须将 bannerBox div 实际放入文档中，方法是将其传递到文档中某些元素上的 appendChild 或 insertBefore (例如document.body):

document.body.appendChild(bannerBox);

(但它可以是文档中的任何元素，不一定是body。)

一旦它出现在文档中，您就可以按照显示的方式通过 id 检索它。

当然(这不是您遇到的问题，但它可能是下一个问题)，因为 bannerBox 有任何子节点(例如，因为 childNodes 不是一个空的 NodeList)，你需要在里面放一些东西。从你的变量名，我想你可能想把 bannerAd 放在里面，例如:

bannerBox.appendChild(bannerAd);