javascript-按高度均衡两个UL

我遇到的情况是,我获得了一个UL,而LI数量却未知.我正在寻找使用JS将LI分为2个UL(我正在使用jQuery).我可以按LI的数量均匀地划分UL,但是我也想根据每个LI的高度对其进行划分,以使两个UL都接近相同的高度.

对此的任何帮助将不胜感激,我不觉得自己从采用的方法中学到了什么.

谢谢.

编辑：我目前有JS代码. HTML只是直线的UL / LI,每个LI的高度都可以变化.

var $sections = $('div.subsection');

$sections.each(function(){
  var $section = $(this);

  var $list = $section.children('ul');
  var $items = $list.children('li');
  var itemCount = $items.size();
  var leftover = itemCount % 2;
  var itemsPerColumn = Math.floor(itemCount / 2);
  var $newList = $('<ul />');

  $items.each(function(){
    var $this = $(this);
    var index = $items.index($this);

    if (index >= (itemsPerColumn + leftover)) {
      $this.remove().appendTo($newList);
    }
  });

  $list.after($newList);

  _equalizeListHeights();

  function _equalizeListHeights(){
    var listHeight = $list.height();
    var newListHeight = $newList.height();

    if (listHeight > newListHeight){
      var $lastItem = $list.children('li:last');
      var lastItemHeight = $lastItem.height();

      if (listHeight - lastItemHeight > newListHeight + lastItemHeight){
        $lastItem.remove().prependTo($newList);
        _equalizeListHeights();
      }
    }
  }

});

解决方法:

我认为至少可以在这里看到这种方法：

>计算所有列表项的总高度(总计),并存储所有单个高度
>计算一个列表的高度(总计/ 2)
>确定一种算法,以求出一组高度之和,以使其总计为2,而不超过该高度.
>将具有这些高度的元素放入第一个列表,然后将其余的放入第二个

步骤3有点棘手.与Subset Sum Problem有关.

编辑

Here’s a brute-force algorithm解决了您的问题.它不能在window.resize上运行,因为那很愚蠢.如果要更改它,请调整结果窗口的大小,然后按“运行”.

//Sum a jQuery wrapped array
$.fn.sum = function() {
    var total = 0;
    this.each(function() { total += this; });
    return total;
};
//Mask elements with a bitmask
$.fn.mask = function(mask) {
    return this.filter(function(i) {
        return (mask >> i) & 1;
    })
}

//Get the sizes, and sneakily return a jQuery object
var sizes = $('.first li').map(function() { return $(this).outerHeight() });

var total = sizes.sum();
var maxTotal = total / 2;

var best = {
    total: 0,
    mask: 0
}

for (var subsetMask = 1; subsetMask < (1 << sizes.length); subsetMask++) {
    //Sum all the heights in this subset
    var subsetTotal = sizes.mask(subsetMask).sum();

    //New optimal solution?
    if (subsetTotal > best.total && subsetTotal <= maxTotal) {
        best = {
            total: subsetTotal,
            mask: subsetMask
        };
    }
}

$('.first li').mask(best.mask).appendTo('.second');