jquery - 如何使用jquery为第一个列表项应用事件类

Question

<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>

我们如何才能使用 jquery 将“事件”类仅应用于第一个“li”(即 Lorem)，而不是应用于“ul”下的所有第一个“li”。我希望输出为

<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>

Answer 1

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

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

或者 .first() ，这是 .eq(0) 的别名或 .slice(0,1) 甚至，像这样:

$(".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() 为了清楚起见。