JS设置Div高度无效求助：如何将row的vh单位minHeight赋值给row2？

嘿，我来帮你定位问题啦！你的代码核心问题出在获取样式的方式上：

• document.getElementById('row').style.minHeight 只能读取元素的内联样式（也就是直接写在元素的style属性里的样式，比如<div id="row" style="min-height: 50vh">）。如果你的min-height是定义在外部CSS文件、内部<style>标签里的，这个方法会返回空字符串，导致后面给row2设置的height变成了vh（空字符串加vh），自然没有任何效果。

正确的实现方式 #

我们需要用window.getComputedStyle()来获取元素最终计算后的样式，这个方法能拿到所有应用在元素上的样式，不管是内联、内部还是外部定义的。而且它返回的样式值已经包含单位了，不需要额外拼接：

window.onload = function() {
  const rowElement = document.getElementById('row');
  // 获取元素最终计算后的样式对象
  const computedStyles = window.getComputedStyle(rowElement);
  // 直接拿到带单位的min-height值
  const rowMinHeight = computedStyles.minHeight;
  // 把这个值赋值给row2的height
  document.getElementById('row2').style.height = rowMinHeight;
}

额外提示 #

1. 如果你担心window.onload等待资源加载太慢（它会等所有图片、资源都加载完才执行），可以换成DOMContentLoaded事件，只等DOM结构加载完成就执行：

document.addEventListener('DOMContentLoaded', function() {
  // 上面的代码放在这里
});

2. 注意不要重复拼接单位：getComputedStyle返回的minHeight已经是类似"60vh"的完整值，再加+'vh'会变成"60vhvh"，反而会导致样式失效。

内容的提问来源于stack exchange，提问作者mauro