我在另一个 div 中有一个 div。父级有一个特定的类名，没有专门应用任何 css。子元素应用了 CSS，特别是它的背景颜色。所以它看起来像这样......
<div id='myparent' class='someclass'>
<div id='mychild' class='somebgcolor'></div>
</div>
我想做的是当父div的类改变时改变子div的背景颜色。所以我正在用这个 javascript 改变父类...
document.getElementById('myparent').className = 'someotherclass';
在我的 CSS 中...
.someclass .somebgcolor {
background-color: #369;
}
.someotherclass .somebgcolor {
background-color: #401;
}
但它不起作用。对于初学者来说，初始背景颜色甚至没有应用，当我更新父 div 的类时也没有应用背景颜色。我是否遗漏了一些关于将 CSS 应用于嵌套元素的工作方式的基础知识？
最佳答案
我认为您没有遗漏任何东西。我刚刚试了一下，效果很好:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.someOtherClass {
background-color: yellow;
}
.someOtherClass .someBgColor {
background-color: red;
}
</style>
</head>
<body>
<div id="myParent" class="someClass">
<div id='myChild' class="someBgColor">
asdasadasd
</div>
</div>
<script>
var parent = document.getElementById('myParent');
parent.className = "someOtherClass";
</script>
</body>
</html>
关于javascript - 更改父类时更改子类的CSS属性，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29267758/