如何使用jQuery将活动类应用于第一个列表项 [英] How to apply active class for first list item using jquery

问题描述

<div class="accordion">
<ul class="navigation">
    <li>Lorem</li>
    <li>Ipsum</li>
    <li>Donor</li>
</ul>
<ul class="navigation">
    <li>Test</li>
    <li>Demo</li>
    <li>Donor</li>
</ul>
</div>

我们如何才能将使用活动"类的类仅应用于第一个"li"(即Lorem)，而不是使用jQuery对"ul"下的所有第一个"li"类应用. 我想得到的输出为

How can we apply a class which is 'active' to first 'li' (ie;Lorem) only, not for all first 'li' under 'ul' using jquery. I would like to get output as

<div class="accordion">
<ul class="navigation">
    <li class="active">Lorem</li>
    <li>Ipsum</li>
    <li>Donor</li>
</ul>
<ul class="navigation">
    <li>Test</li>
    <li>Demo</li>
    <li>Donor</li>
</ul>
</div>

推荐答案

您可以使用 :first (与 :first-child 相对，这将获得第一个- c2>)和 .addClass() 像这样:

You can use :first (as opposed to :first-child which would get the first per-<ul>), and .addClass() like this:

$(".accordion li:first").addClass("active");

或 .first() ，它是 .slice(0,1) 甚至是这样:

Or .first(), which is an alias for .eq(0) or .slice(0,1) even, like this:

$(".accordion li").first().addClass("active");
//or
$(".accordion li").eq(0).addClass("active");
//or
$(".accordion li:eq(0)").addClass("active");
//or
$(".accordion li").slice(0,1).addClass("active");

有几种解决方法...尽管我更喜欢 :first 或 .first() 为清楚起见.

There are a few ways to go about it...though I prefer :first or .first() for clarity.

这篇关于如何使用jQuery将活动类应用于第一个列表项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！