用JavaScript平衡对象的宽度

我有我打印在我的模板与对象的列表

each object in objects <div class="col-md-4">..</div>

我使用Bootstrap，所以col-md-4意味着div元素应该占用1/3的空间。

但是我希望col-md-4是随机的。但是我想要这样，1,2或3个元素占据整行（应该总计为12）。

所以我想要它

  <div class="col-md-4">..</div> <div class="col-md-4">..</div> <div class="col-md-4">..</div>

要么

  <div class="col-md-8">..</div> <div class="col-md-4">..</div>

要么

  <div class="col-md-4">..</div> <div class="col-md-8">..</div>

要么

  <div class="col-md-6">..</div> <div class="col-md-6">..</div>

要么

  <div class="col-md-12">..</div>

这几乎是大多数在线报纸的样子。但我不知道如何平衡它。

我想我应该采取整个数组objects并随机select多less行。如果我有15个元素，我最多可以做15行（每个都有col-md-12 ），我必须至less做15/3 = 5行，所以行数应该在中间。然后，我需要决定每行应该有多less列，然后平衡每个对象的宽度，使特定行中的元素总和为12。

我怎样才能做到这一点？另外，在大多数报纸网站上，不同文章的大小似乎并不完全是随机的（就像我的脚本那样），那么他们怎么可能有随机的大小，虽然他们不经常改变？我想我可以通过使用对象的创build时间或其他东西来确定它们的大小？

更具体地说，我不必将行封装在列中。我只需要确保成功的对象总和为12。

所以，如果我有5个对象，他们需要，例如，打印

 col-md-12 col-md-4 col-md-4 col-md-4 col-md-12

要么

 col-md-8 col-md-4 col-md-4 col-md-4 col-md-4

所以我想这足以：

因此，我将需要一个总是存储最后3个打印对象的宽度的variables（如果总和为12，我知道我即将创build一个新行）。