javascript - 如何为 <li> 的直接子级添加一个类？

Question

<ul>
 <li><a href="">link 1</a></li>
 <li><a href="">link 2</a></li>
 <li><a href="">link 3</a>
   <ul>
    <li><a href="">link 1</a></li>
    <li><a href="">link 2</a></li>
   </ul>
 </li>
</ul>

如何在悬停 LI 时向 LI 的直接子级“a”添加类。

当我把鼠标移出 LI 时。该类应该被删除。

我正在尝试为此编写以下代码。

$('.nice-menu li').mouseover(function(){
       $(this).children('a' , 'span a')
    }) ;  

Answer 1

您可以使用 .hover() 执行此操作和 .toggleClass() ，像这样:

$('.nice-menu li').hover(function(){
   $(this).children('a' , 'span a').toggleClass('hoverClass');
});  

请注意事件会冒泡，所以在嵌套链接的情况下，类将在父级和子级上切换，但通常你想在菜单中突出显示你所在的父级，不确定尽管如此，you can see what I mean here .