Javascript 如何在SVG中使用和设置（选择器）嵌套符号的样式

我有如下几点：

html，正文{
保证金：0；
填充：0；
溢出：隐藏；
}
树丛>树>三角形{
/*一些三角形样式*/
}
#树丛1>树>三角形{
/*grove 1的一些三角形样式*/
}
#树丛2>树>三角形{
/*grove 2的一些三角形样式*/
}
#树丛3>树>三角形{
/*grove 3的一些三角形样式*/
}
#树丛3>树{
/*给树设置动画*/
}

如果我没记错的话，要做到这一点的诀窍是将您想要为

的每个实例设置的不同属性设置为“继承”或“currentColor”（或者，如果它们是默认继承的，如果您不需要，请不要设置它们）然后将每个

放在

中，并将样式声明应用于每个

---

样式可以继承到

的子项中，请参见以下内容：

html，正文{
保证金：0；
填充：0；
溢出：隐藏；
}
#小树林{
/*一些三角形样式*/
}
#格罗夫1{
/*grove 1的一些三角形样式*/
填充物：红色；
}
#格罗夫2{
/*grove 2的一些三角形样式*/
填充：绿色；
}
#格罗夫3{
/*grove 3的一些三角形样式*/
填充物：黄金；
}
#树丛3>树{
/*给树设置动画*/
}