javascript - 动态设置DIV的高度

Question

在 Web 应用程序中，我有一个包含 DIV 的页面，该 DIV 的宽度取决于浏览器窗口的宽度。

我需要对象的自动高度。 DIV 从顶部屏幕开始约 300 像素，其高度应使其延伸到浏览器屏幕的底部。我有容器 DIV 的最大高度，因此 div 必须有最小高度。我相信我可以在 CSS 中限制它，并使用 Javascript 来处理 DIV 的大小调整。

我的 javascript 没有达到应有的水平。我可以编写一个简单的脚本来为我执行此操作吗？

编辑:DIV 包含一个控件，该控件执行自己的溢出处理(实现自己的滚动条)。

Answer 1

试试这个简单、具体的函数:

function resizeElementHeight(element) {
  var height = 0;
  var body = window.document.body;
  if (window.innerHeight) {
      height = window.innerHeight;
  } else if (body.parentElement.clientHeight) {
      height = body.parentElement.clientHeight;
  } else if (body && body.clientHeight) {
      height = body.clientHeight;
  }
  element.style.height = ((height - element.offsetTop) + "px");
}

它不依赖于指定的 body 顶部的当前距离(如果您的 300px 发生变化)。

---

编辑:顺便说一句，每次用户更改浏览器的大小时，您都希望在该 div 上调用它，因此您当然需要为此连接事件处理程序。