使用JavaScript，如何基于另一个元素的CSS样式更改一个元素的CSS样式？

我试图根据另一个div的不透明度/可见性来更改一个div的高度。这看起来应该很简单，但我尝试的任何方法似乎都不起作用

我在想会是这样的：

var red = document.getElementById("red");
var green = document.getElementById("green");

if(red.style.opacity = "0"){
green.style.height = "200px";
}

但这只是改变了不透明度和高度，而没有真正检查不透明度是从什么开始的

---

任何关于如何实现我所追求的功能的建议都将不胜感激

看起来您正在显式设置不透明度。以下代码应该可以工作：

if(red.style.opacity == 0){
   green.style.height = "200px";
}

使用getComputedStyle-

getComputedStyle（）方法获取所有实际（计算）CSS 属性和指定元素的值

var red=document.getElementById（“红色”）；
var rd=window.getComputedStyle（红色）.getPropertyValue（“不透明度”）；
var green=document.getElementById（“绿色”）；
如果（rd==0）{
green.style.height=“200px”；
}

#红色{
宽度：50px；
高度：50px；
背景：红色；
不透明度：0；
}
#绿色的{
宽度：50px；
高度：50px；
背景：绿色；
}

红色
绿色

red.style.opacity==“0”

如果（red.style.opacity==“0”）

是您要查找的内容，则只有一个

=

符号指定值。感谢您的快速响应。我错过了什么？非常感谢你！这看起来正是我所希望的。我不知道getComputedStyle（）。这在我所有的测试中都非常有效！我不知道为什么你的评论被否决了。。。这种方法有什么缺点吗？再次感谢您的帮助。Welcome@emma:-）我不知道为什么它被否决，但这就是您可以检查分配给元素的样式，并且输出可以进一步与条件一起使用的方式。这似乎不起作用。无论不透明度如何，高度都会发生变化：