javascript - 通过祖 parent 的父类选择一个 css3 元素

Question

我在我的站点中实现了多个范围 slider ，因为这是实时生成的代码，所以我需要通过它们的父类选择一些元素。

这是时间线类的代码，是我可以自己设置的最后一个代码，我需要能够在不更改其他 slider 的情况下编辑 .irs-line-right

Answer 1

在您的问题中，您声明要通过父元素访问元素。我不明白为什么这是必要的，但这肯定是可能的。可以通过js改变元素样式、属性等。但是，如果您只需要使用“irs-line-right”类更改跨度的样式，最好只使用 css。我将展示如何在 css 和 javascript 中执行此操作。

CSS 示例

在 css 中你可以改变 'irs-line-right' 的样式通过引用“时间轴”div(没有其他 ID 或类)，如下所示:

https://jsfiddle.net/2t3w0826/

.timeline > div:nth-of-type(2) > span > span > span > span:nth-of-type(3)
{
  background-color: red;
}

Javascript 示例

https://jsfiddle.net/8qceLgw8/

var array_of_all_timelines = document.getElementsByClassName("timeline");
for(var loop=0; loop < array_of_all_timelines.length; loop++)
{
  var element_irs_line_right = array_of_all_timelines[loop].children[1].children[0].children[0].children[0].children[2];
  element_irs_line_right.style.backgroundColor = "red";
};