const tree = Object.values(document.getElementsByClassName('xxx')) // 获取所有类名为el-tree-node__content的div（更改背景色就是更改xxx的背景色）， // 这是一个对象，需要先更改未数组类型再进行判断 其内部所有的 子元素 也为对象因此在map时均需要进行更改 // 直到在第三层找到我们自己定义的id yyy时将xxx的背景色更改掉，其余的同类均改为默认背景色 tree.map((item) => { 一、 CSS 介绍 CSS 的全称是 Cascading Style Sheet（层叠 样式 表），它主要用来控制网页的 样式 （美化网页）。 CSS 早已被所有主流浏览器采用，它允许你轻松控制以下 样式 ： 颜色 color 背景 background 字体 font 位置 position 显示 display 边框 border 内边距 padding 外边距 margin 行高 line-height 装饰 text-decoration 过渡 transtion 变化 transform 动画 an

要 实现 当鼠标点击 子元素 时， 父 元素 改变 样式 ，可以使用 CSS 伪类选择器`:active`和后代选择器。 首先，你需要为 父 元素 和 子元素 定义 样式 。例如，在下面的示例中，我们将为 父 元素 `<div>`和 子元素 `<a>`定义 样式 ： ```html <div id="parent"> <a href="#"> 子元素 </a> ``` css #parent { background-color: blue; #parent:active a { color: red; 在这个示例中，我们为 父 元素 `<div>`定义了一个蓝色背景色，并使用`#parent`选择器对其进行 样式 化。我们还使用`:active`伪类选择器和后代选择器为 子元素 `<a>`定义了一个红色文本颜色。当用户点击 子元素 `<a>`时，`:active`伪类选择器将应用于 父 元素 ，而`<a>`的文本颜色将变为红色。 请注意，这种方法只在鼠标点击期间有效。当用户释放鼠标按钮时， 父 元素 和 子元素 的 样式 将恢复为未激活状态。