javascript - 如何以更复杂的方式编写它？

Question

这行得通，但我确信它写得更干净。

<script>
$(document).ready(function(){
  $('.col').css({'height':($(document).height())+'px'});
  $(window).resize(function() {
    $('.col').css({'height':($(document).height())+'px'});
  });
}
</script>

我试过没有第一个$('.col').css...，但它不起作用。所以基本上我想告诉浏览器的是：“当文档准备好时，调整这个 div 的大小，并在每次高度变化时继续调整它的大小”。

Answer 1

这里是：

<script>
    $(window).resize(function() {
        $('.col').css({'height':($(document).height())+'px'});
    });
    $(function(){
        $(window).trigger('resize');
    });
</script>

您可以监听resize事件并在文档准备好时触发它。

其他小改动：

• 你可以document.ready简化$(function(){})
• 可以在之前创建调整大小事件侦听器document.ready，因为该window对象始终存在，您可以在需要时尽早将事件附加到它。

Answer 2

或另一种变体，具有一点（我猜）更清晰的语法：

$(window).resize(function() {
    $('.col').height($(document).height());
}).resize();