跨度外部背景控制的层次结构

Question

我有一个跨度层次结构来定义不同的注释层：

<span class="eventRel" id="e12-e32">
    <span class="event">
        <span class="hl" id="moh">
            soluzione
            <span style="width:500px;">
                tokenid: 11
            </span>
        </span>
    </span>
</span>

然后我有不同的控制器，用不同的颜色突出显示具有背景属性（在本例中为：soluzione）的令牌。

所以，当我在class="hl"上方有一个span层时，我的代码就可以工作了。

在某些情况下，超过3个跨度位于class="hl"之上。

我要强调的是：

document.getElementById('e12-e32').style.backgroundColor='white';

这只是以防万一：

<span class="event">
    <span class="hl" id="moh">
        soluzione
        <span style="width:500px;">
            tokenid: 11
        </span>
    </span>
</span>

在这方面提供帮助！，提前谢谢。

所以我需要应用这种风格来突出显示单词soluzione：

  <span class="eventRel" id="e12-e32" style="background-color:yellow;">
    <span class="event">
        <span class="hl" id="moh">
            soluzione
            <span style="width:500px;">
                tokenid: 11
            </span>
        </span>
    </span>
</span>

Answer 1

我不知道我是否正确理解了您的问题，但要选择您可以使用的所有子代：

  document.querySelectorAll(".e12-e32")

Answer 2

我应用了内联样式，我认为以下代码可能会有所帮助。。

    <span class="event">
    <span class="hl"  style="background-color:yellow;">
        soluzione
        <span style="width:500px;background-color:red;">
            tokenid: 11
        </span>
    </span>
</span>

Answer 3

在这里我写了发生的事情，我试图突出显示单词soluzione，如果该单词参与到一个（注释层是一个span）中，那么解决方案是，给每个（注释层=span）一个类名，并在类名上应用样式，所以我的错误实现是我使用id来识别span，然后我在id上有重复。

因此，当您发现某些样式无法正常工作时，请首先检查id上是否存在重复。因为会有任何错误通知，并且更改将只应用于具有该id的第一个元素！