Question

我有数据= [1,2,3,4,5，...]

可以更改数据量。

这里，我有5个数据，想要根据数据的数量（array.length）动态创建5个div，以便div的宽度在行中平均调整。

使用以下方法： -

var html="";
/*
-
-
-
*/
html +="<div</div>"

Answer 1

使用flex CSS显示模式。如果你使用jQuery，这很容易。

<div style="display: flex;" id="parent"></div>
<script type="text/javascript">
    jQuery(document).ready(function() {
        var arr = [1, 2, 3, 4, 5];
        for (k in arr) {
            jQuery('#parent').append('<div style="flex: 1;">' + arr[k] + '</div>');
        }
    });

</script>

＆＃13;

.display_flex {
  display: flex; /* Important! */
}

.flex_entry {
  flex: 1; /* Important! */
  margin: 1px;
  border: 1px solid red;
  padding: 20px;
}

＆＃13;

<div class="display_flex">
  <div class="flex_entry"></div>
  <div class="flex_entry"></div>
  <div class="flex_entry"></div>
</div>

<div class="display_flex">
  <div class="flex_entry"></div>
  <div class="flex_entry"></div>
  <div class="flex_entry"></div>
  <div class="flex_entry"></div>
  <div class="flex_entry"></div>
</div>

＆＃13;

More about flex

根据数据的数量动态创建div，在一行中等分宽度

1 个答案: