javascript - onclick 只有一个 href addClass

Question

我有一页 HTML 和标题上的那些链接，每次单击一个链接时我都需要 <a>那么只有那个 <a>将类更改为 (.links)。

我已经尝试了很多方法，但是我现在在我的 Jquery 中使用这种方法，每次我点击任何 <a>他们都将类添加到 (.links)，而这不是我要找的。

我应该为每个 <a> 使用类/ID 吗？并使用 Javascript/Jquery 或其他任何简单的方法来定位它们？

<nav>
    <ul>
        <li>
            <a href="#HOME">HOME</a>
        </li>
        <li>
            <a href="#ABOUT">ABOUT US</a>
        </li>
        <li>
            <a href="#SERVICES">SERVICES</a>
        </li>
        <li>
            <a href="#TEAM">TEAM</a>
        </li>
        <li>
            <a href="#PORTFOLIO">PORTFOLIO</a>
        </li>
        <li>
            <a href="#PRICING">PRICING</a>
        </li>
        <li>
            <a href="#BLOG">BLOG</a>
        </li>
        <li>
            <a href="#CONTACT">CONTACT</a>
        </li>
    </ul>
</nav>

<script>
$('li').click(function(){
$('a').addClass('links');
});

</script>

Answer 1

仅针对点击的 LI 内的 anchor

$('li').click(function(){
    $(this).find('a').addClass('links');
});

如果你也想删除其他 anchor 上的类

$('li').click(function(){
    var this_one = $(this).find('a').addClass('links');
    $('li a').not(this_one).removeClass('links');
});