如何在可以滚动的页面底部显示页脚？

<div class="content">
  <!-- 页面主要内容 -->
</div>

<footer class="footer">
  <!-- 页脚内容 -->
</footer>

.content {
  position: relative;
  /* 其他样式 */
}

.footer {
  position: fixed;
  bottom: 0;
  /* 其他样式 */
}

window.addEventListener('scroll', function() {
  var contentHeight = document.querySelector('.content').offsetHeight;
  var windowHeight = window.innerHeight;
  var scrollY = window.scrollY || window.pageYOffset;

  if (scrollY + windowHeight >= contentHeight) {
    document.querySelector('.footer').classList.add('visible');
  } else {
    document.querySelector('.footer').classList.remove('visible');
  }
});