javascript - 检查类(class)有另一个类(class)并将类(class)添加到下一个 child

Question

我在导航中设置了以下内容:

<div class="navegacion"><a href="/sobre" title="Sobre Nostros">Sobre Nosotros</a></div>
<div class="navegacion"><a href="/noticias" title="Noticias">Noticias</a></div>
<div class="navegacion"><a href="/elementos" title="Elementos">Elementos</a></div>
<div class="navegacion"><a href="/lugares" title="Lugares">Lugares</a></div>
<div class="navegacion"><a href="/propositos" title="Propositos">Propositos</a></div>
<div class="navegacion"><a href="/esculeas" title="Escuelas">Escuelas</a></div>

当用户访问一个页面，例如 www.example.com/sobre 时，一个新类被添加到 sobre 中，所以它看起来像那些

<div class="navegacion seleccionado"><a href="/sobre" title="Sobre Nostros">Sobre Nosotros</a></div>

我知道如何检查类 navegacion 是否有一个类 seleccionado，但我想做的是为下面的子 navegacion 有一个类 >seleccionado 添加一个类 oscuro，所以如果我在页面 sobre

中，它看起来像这样

<div class="navegacion seleccionado"><a href="/sobre" title="Sobre Nostros">Sobre Nosotros</a></div>
<div class="navegacion oscuro"><a href="/noticias" title="Noticias">Noticias</a></div>

或者像这样，如果我在页面 noticias 中，它看起来像这样

<div class="navegacion"><a href="/sobre" title="Sobre Nostros">Sobre Nosotros</a></div>
<div class="navegacion seleccionado"><a href="/noticias" title="Noticias">Noticias</a></div>
<div class="navegacion oscuro"><a href="/elementos" title="Elementos">Elementos</a></div>

等等

我以为我可以这样做

$( document ).ready(function() {
    if($(".navegacion").hasClass("seleccionado")) {
        $(this).next().addClass("oscuro");
    }
});

但它显然不起作用。

Answer 1

this 不引用元素，它引用 document 对象。因此，选择具有这两个类的元素并执行相同的操作。

$(document).ready(function() {
  $(".navegacion.seleccionado").next().addClass("oscuro");
});