如何在JavaScript中动态添加div？

我有以下代码

<div class="col l3 m6 w3-margin-bottom">
  <div class="display-container">
    <div class="w3-display-topleft w3-black w3-padding">Brick House</div>
    <img src="image.jpg" alt="House" style="width:99%">
  </div>
</div>

---

我希望能够通过JavaScript代码动态地添加这个的倍数。请告诉我，我不是很精通JavaScript，任何有帮助的

在代码中获取对DOM元素的引用，无论它是通过id、类名、标记名等，然后将其作为字符串附加到innerHTML属性：

let el = document.getElementById('id');
el.innerHTML += '
<div class="col l3 m6 w3-margin-bottom">
  <div class="display-container">
    <div class="w3-display-topleft w3-black w3-padding">Brick House</div>
    <img src="image.jpg" alt="House" style="width:99%">
  </div>
</div>
';

使用jQuery：

$(document).append('<div class="col l3 m6 w3-margin-bottom"> <div class="display-container"> <div class="w3-display-topleft w3-black w3-padding">Brick House</div> <img src="image.jpg" alt="House" style="width:99%"> </div> </div>');

---

这是一个使用新模板字符串的简单方法

您甚至可以通过在模板字符串中执行${myVar}来将变量值放入其中

//这是您可以更改的代码 让代码=` 砖房 `; //可以将其附加到HTML中的元素 document.getElementById'id'.innerHTML+=代码；