如果容器元素的內容比容器元素高，請向容器添加類

Question

由於我無法使用出色的設計，因此該特定站點上的許多元素具有固定的高度。 因此，當這些元素的內部高度超過固定高度時，它們的內容就會被切斷。 因此，基本上，我想在頁面上所有固定高度的容器元素中添加一類“可擴展”， 如果其中的內容由於其高度高於容器而被截斷。 只是想看看我是否正確地做到了。 謝謝您的幫助。

feature = $('.feature-block');

feature.each(function() {
  containerHeight = $(this).outerHeight();
  containerChildren = $(this).children();

  containerChildren.each(function() {
    childrenHeight = $(this).outerHeight();

    if(childrenHeight > containerHeight) {
        $(this).closest(feature).addClass('expandable');
    }
  });
});

Answer 1

您需要對孩子的身高求和：

feature.each(function() {
  var containerHeight = $(this).outerHeight(),
      containerChildren = $(this).children(),
      childrenHeight = 0;

  containerChildren.each(function() {
    childrenHeight += $(this).outerHeight();
  });

  if(childrenHeight > containerHeight) {
     $(this).closest(feature).addClass('expandable');
  }
});