Javascript jQuery：页面的初始加载并没有找到元素，但当调整大小时，找到了元素。

我有下面的代码来添加和删除一个类，这取决于

。woocommerce mini cart

是否比它的父元素短

$(document).ready(function(){
  function maybeAdjustCartClass() {
    let cartWrapper         = $( '.woocommmerce-mini-cart-wrapper' );
    let cartHeight          = $( '.woocommerce-mini-cart' ).height();
    let cartLength          = $( '.woocommerce-mini-cart' ).length;
    let cartContainerHeight = $( '.widget_shopping_cart_content' ).height();

    if ( cartLength < 1 || cartHeight < cartContainerHeight ) {
        cartWrapper.addClass( 'add-height' );
    } else {
        cartWrapper.removeClass( 'add-height' );
    }
  }

  maybeAdjustCartClass();

  $( window ).on( 'resize', function() {
     maybeAdjustCartClass();
  } );
});

$（文档）.ready（函数（）{
函数maybeAdjustCartClass（）{
让cartWrapper=$（'.woocommerce mini cart wrapper'）；
让购物车高度=$（'.woocommerce mini cart'）.height（）；
让cartLength=$（'.woocommerce迷你购物车'）.length；
让cartContainerHeight=$（'.widget\u shopping\u cart\u content'）.height（）；
if（车长<1 | |车高<车箱高度）{
addClass（'addheight'）；
}否则{
cartWrapper.removeClass（'addheight'）；
}
}
maybeAdjustCartClass（）；
$（窗口）.on（'resize'，function（））{
maybeAdjustCartClass（）；
} );
});

在页面加载时，

cartHeight

为

null

，

cartLength

为

0

。只要我做了任何类型的调整，一切都按预期进行。购物车长度表示为1，并且

.woocommerce mini Cart

与inspector表示为的高度相匹配，类被添加和删除到元素中。它只在页面加载时不起作用。我试图通过添加

cartLength<1

操作符以及尝试

cartLength==0

或

cartlheight==null

来解释这一有趣之处，但都无济于事

---

我甚至给了

.woocommerce迷你车

1倍的最低高度，但都没有用

.woocommerce迷你购物车

存在于页面加载中，并且位于DOM中。我完全搞不懂为什么这不能像预期的那样起作用

向我建议在页面加载后添加类。如果它不在页面源代码中，那么它可能是使用JavaScript添加的来解决这个问题的，我想你可以声明CartLength=1，这可能会起作用？只是好奇，你到底想实现什么？添加高度CSS类做什么？这是纯CSS解决方案可以实现的吗？@Andrew我尝试了一个单独的CSS解决方案，但经过几个小时的努力，我发现我需要一点JS。这将使页脚在脱离画布的幻灯片上保持与视口底部的粘性。不幸的是，它们在Chrome和Firefox中的位置是已知的bug：fixed在嵌套的固定元素和应用了transform的元素中工作不好。客户机主题的非画布滑入具有这两种功能。