Javascript 在一个div内追加多个div

为了在中设置图像动画，我需要在当前标记所在的图像上使用Javascript添加许多div

<div class="js-img-in">
 <figure><img src="test.jpg"></figure>
</div>

这一错误使我陷入困境。但是，这里的createTextNode不会帮助我，因为我正在添加一个元素节点，而不是文本

---

QuerySelector在此实例中是否不起作用

您的意思是在images.length中循环并使用图像位置吗？因为document.querySelectorAll的结果是一个节点列表，而不仅仅是一个节点

const imageAnimIn = () => {
  const images = document.querySelectorAll(".js-img-in");
  for (var x = 0; x < images.length; x++) {        // Loop through each result
    for (var _ = 0; _ < 5; _++) {                  // Updated to disregard variable
      var imageOverDivs = document.createElement('div');
      imageOverDivs.className = "js-anim-img-in";
      images[x].appendChild(imageOverDivs);        // Added [x]
    }
  }
}

---

你的意思是在images.length中循环并使用图像位置吗？因为document.querySelectorAll的结果是一个节点列表，而不仅仅是一个节点

const imageAnimIn = () => {
  const images = document.querySelectorAll(".js-img-in");
  for (var x = 0; x < images.length; x++) {        // Loop through each result
    for (var _ = 0; _ < 5; _++) {                  // Updated to disregard variable
      var imageOverDivs = document.createElement('div');
      imageOverDivs.className = "js-anim-img-in";
      images[x].appendChild(imageOverDivs);        // Added [x]
    }
  }
}

您需要的是querySelector，而不是querySelectorAll。然后需要Node.insertBefore，并将figure元素作为第二个参数传入

常量imageAnimIn==>{ const image=document.querySelector.js-img-in const fig=document.querySelector.js-img-in>图 对于变量x=0；x<5；x++{ var imageOverDivs=document.createElement'div'； imageOverDivs.className=js anim img in； image.insertBeforeimageOverDivs，图 } } imageAnimIn .js anim img in:：after{ 内容：新部门 } -> 您需要的是querySelector，而不是querySelectorAll。然后需要Node.insertBefore，并将figure元素作为第二个参数传入

常量imageAnimIn==>{ const image=document.querySelector.js-img-in const fig=document.querySelector.js-img-in>图 对于变量x=0；x<5；x++{ var imageOverDivs=document.createElement'div'； imageOverDivs.className=js anim img in； image.insertBeforeimageOverDivs，图 } } imageAnimIn .js anim img in:：after{ 内容：新部门 }

---

->在本例中，images实际上是一个包含父div的数组。这非常有用。非常感谢。在本例中，images实际上是一个包含父div的数组。这非常有用。非常感谢。

const imageAnimIn = () => {
  const images = document.querySelectorAll(".js-img-in");
  for (var x = 0; x < images.length; x++) {        // Loop through each result
    for (var _ = 0; _ < 5; _++) {                  // Updated to disregard variable
      var imageOverDivs = document.createElement('div');
      imageOverDivs.className = "js-anim-img-in";
      images[x].appendChild(imageOverDivs);        // Added [x]
    }
  }
}