Question

给定浮动div的选择只有A-G的高度是多少，好像A-G的高度是单个div？

示例位置取决于视口的宽度划分A到G。

    <section>
        -->  [A][B][    C   ][D]
        |    [                 ]
        |    [                 ]
height--|    [        E        ] 
        |    [                 ]
        |    [                 ]
        |    [         F           ]
        -->  [G]
        ...
        [ Z ]
    </section>

所以我猜可能有一个技巧只能找到左边最小的左边位置，然后从每个项目中检索高度。我想只选择A-G高度而不是A-Z高度。即使左侧位置与精确匹配，是否有更准确或标准的方法来执行此操作？

var gatherHeight = 0;
var sectionLeft = $("section").position().left;
$("section > div:nth-child(-n+7)").each(function() {
  if ($(this).position().left == sectionLeft)
  {
     gatherHeight += $(this).height();
  }
});

Answer 1

据我所知，jQuery每个函数的工作方式是你传递一个你想循环的元素数组作为参数，像这样，

<强>的jQuery

var height = 0;
var elements = $('.elements');

$.each(elements,function(key,value) {

   height += $(this).height();
});

纯JS

var height = 0;

var elements = document.querySelectorAll('.elements');

for(var i = 0;i < elements.length;i++) {

    height += elements[i].offsetHeight();
}

<强>更新

<强> HTML

<section>
    <div class="parent in-viewport">
        <div class="child">

        </div>
        <div class="child">

        </div>
        <div class="child">

        </div>
    </div>
    <div class="parent out-viewport">
        <div class="child">

        </div>
        <div class="child">

        </div>
        <div class="child">

        </div>
    </div>
</section>

<强>的jQuery

var height = 0;
var parents = $('.in-viewport');

$.each(parents,function(key,value) {

   height += $(this).height();
});

找到一组浮动div的高度，就像它是一个div一样

1 个答案: