制作一个元素并将其放入一组元素

Question

我想制作一个div并将其放入具有.folio-item类的所有元素中，但是我不知道该怎么做。

Answer 1

您可以使用查询选择器来获取所有folio-item类的元素。然后，您可以使用for循环来遍历那些元素，并创建一个div以使用document.createElement附加到那些元素上。

.folio-item{
 border: 1px solid blue;
}

<div class="folio-item">
1
</div>
<div class="folio-item">
2
</div>
<div class="folio-item">
3
</div>
<script>
var divs = document.querySelectorAll(".folio-item");
for(let i = 0; i < divs.length; i++){
  var div = document.createElement("div");
  div.innerHTML = "<b style='color: red;'>Appended div</b>";
  div.style.border = "1px solid green";
  div.style.padding = "10px";
  div.style.margin = "5px";
  divs[i].appendChild(div);
}
</script>