如何获取数组成员并将它们一一放入 HTML div 中？ [关闭]答案

【问题标题】：How to take array members and put them in HTML divs one by one? [closed]如何获取数组成员并将它们一一放入 HTML div 中？ [关闭]
【发布时间】：2019-06-02 01:54:42
【问题描述】：

我有一个数组：["5","4","2"]。

如何将它们放在 DIV 元素中，以便第一个 DIV 中包含 5，第二个 4，第三个 2，依此类推。

【问题讨论】：

发布的问题似乎根本没有包含any attempt 来解决问题。 StackOverflow 期待您 try to solve your own problem first，因为您的尝试有助于我们更好地了解您想要什么。请编辑问题以显示您尝试过的内容，以说明您遇到minimal reproducible example 的特定障碍。欲了解更多信息，请参阅How to Ask 并拨打tour。
document.body.innerHTML = [5,4,1].map(n=>`<div>${n}</div>`).join("");

标签： javascript jquery html arrays

【解决方案1】：

试试这个：

    array.forEach(function(element) {
      var div = document.createElement('div')
      div.innerHTML = String(element)      

      document.body.appendChild(div)
    })

【讨论】：

【解决方案2】：

var myArray = ["5","4","2"];

for (var i = 0; i < myArray.length; i++) {
    $(".myContainer").append("<div>" + myArray[i] + "</div>");
}

使用 for 循环遍历数组的内容并使用首选方法将其添加到目标。在这种情况下，目标是类.myContainer

【讨论】：

【解决方案3】：

用于数组上的每个循环，如下所示。

var array = ["5", "4", "2"];
var html = '';
$.each(array, function(index, value) {
  html += '<div class="txt">' + value + '</div>';
});
$('#masterDiv').html(html);

.txt {
  background-color: lightblue;
  border-style: solid;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id='masterDiv'></div>

【讨论】：