javascript - 用 JS 改变 .css？使用变量设置动态 .css 属性

Question

我有类似下面的内容:

<div id="left">
    left
</div>
<div id="right">
    right
</div>

使用 .css 属性:

#left {
    width: 60%;
    float: left
    min-height: ###
    max-height: 1000px;
}
#right {
    width: 40%;
    float: right;
    min-height: ###
    max-height: 1000px;
}

注意 ###对于<div> CSS min-height特性。我想要类似下面的东西(一些伪 JS):

var leftheight = document.getElementById(left);
var rightheight = document.getElementById(right);
if (leftheight.currentHeight > rightheight.currentHeight) {
    rightheight.style.min-height = leftheight.currentHeight;
} else if (rightheight.currentHeight > leftheight.currentHeight) {
    leftheight.style.min-height = rightheight.currentHeight;
}

基本上我想要:

if (current height of left > current height of right) {
    min-height of right = current height of left
} else if (current height of right > current height of left) {
    min-height of left = current height of right
} 
//ie. both left and right have the same min-heights, whichever is larger

我的 Javascript 是错误的，这是我刚刚学习的东西。有什么方法可以用来获得我想要的结果吗？

Answer 1

你可以这样做:

if (leftheight.currentHeight > rightheight.currentHeight) {
    rightheight.style.minHeight = leftheight.currentHeight;
} else if (rightheight.currentHeight > leftheight.currentHeight) {
    leftheight.style.minHeight = rightheight.currentHeight;
}

实际上是 minHeight 而不是 min-height。