Javascript 在不使用ID的情况下获取元素的所有父级

我有以下HTML：

<li>
    First Node
  <ul>
    <li>child</li>
    <ul>
        <li id="idTest">child of child</li>
    </ul>
    <li>child2</li>
  </ul>
</li>

第一节点

孩子

孩子的孩子

孩子2

我想为id为“idTest”的

li

的父级

ul

添加一个样式。请注意，所有的

ul

都没有id，并且样式不应添加到

li

“child2”

---

我找不到正确的答案，请帮助。

注意，您的HTML无效，

ul

元素不能将

ul

元素作为直接子元素。您必须将嵌套的

ul

放入

li

或类似文件中

您可以从元素的

parentNode

属性中获取元素的父元素（必要时重复）。例如：

var element = document.getElementById("idTest").parentNode;
while (element.tagName !== "BODY") {
    if (element.tagName === "UL") {
        // Add the style
    }
    element = element.parentNode;
}

示例（带有更正的HTML）：

var element=document.getElementById（“idTest”）.parentNode；
while（element.tagName！=“BODY”）{
如果（element.tagName==“UL”）{
element.style.display=“块”；
}
element=element.parentNode；
}

/*UL的默认显示是block，因此我假设您正在隐藏它们或类似内容*/
保险商实验室{
显示：隐藏；
}

第一节点

孩子


孩子的孩子


孩子2

如果使用jQuery而不是纯javascript，您可以尝试

示例

$（'.activator'）。单击（函数（）{
$（'.#idTest'）.parentsUntil（$（'.ul-1'），'ul'）.css（'backgroundColor'，'red'）；
})

正文{
保证金：0；
}
李先生{
颜色：黑色；
}
.活化剂{
位置：固定；
排名：0；
左：50%；变换：translateX（-50%）；
显示：内联flex；
填充物：3px 5px；
颜色：白色；
背景色：红色；
边框：实心1px黑色；
光标：指针；
}

第一保险商学院第一里


第二保险商实验室的第一里


第三个ul的第一个li（#idTest）


第二保险商学院第三里



点击我

我想添加样式“display:block；”是否可以插入？另外-除了

ul

内部

ul

之外，您建议做些什么？Thanks@D.Griff：display属性不是继承的，因此这很好。Re

ul

in

ul

：将其放入

li

：-）拥有

ul>li>ul>li

是完全正常的，但是你不能拥有

ul>ul

。我尝试了你的函数，收到了错误“无法读取未定义的属性'tagName'，知道原因吗？@D.Griff:我上面的代码不会触发该错误，您的HTML似乎无效：ul元素应该具有的唯一直接子元素是li元素。（如果需要嵌套列表，则子ul应位于li中。）