的jQuery只更換一個。首先（）的實例

Question

說我有這樣的事情：

<div class="carousel-inner onebyone-carosel" id="carousel-inner"> 
    <div class="item"> 
     <!--Stuff--> 
    </div> 
</div> 

<!--Same thing again--> 

<div class="carousel-inner onebyone-carosel" id="carousel-inner"> 
    <div class="item"> 
     <!--Stuff--> 
    </div> 
</div> 

現在，當我使用$(".carousel-inner div:first").addClass('active');，類active只添加div的第一carousel-inner的。第二個保持原樣。

這是預期的行爲？或者我錯過了什麼？

Answer 1

是的，它會將它添加到第一個div。

這樣做：

$(".carousel-inner div:first-child").addClass('active'); 

Answer 2

.carousel-inner div:first選擇的.carousel div第一次出現！ 您可以使用jQuery的find()用於此目的：

$(document).ready(function(){ 
 
$(".carousel-inner").find("div:first").addClass('active'); 
 
    })

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="carousel-inner onebyone-carosel" id="carousel-inner"> 
 
    <div class="item"> 
 
     sdsd 
 
    </div> 
 
</div> 
 

 
<!--Same thing again--> 
 

 
<div class="carousel-inner onebyone-carosel" id="carousel-inner2"> 
 
    <div class="item"> 
 
     dfgdfg 
 
    </div> 
 
</div>

Answer 3

的:first CSS選擇器返回位於div內與類的carousel-inner一個div元素的第一個實例。 AKA的.carousel-inner div

如果你想div的.carousel-inner元素的所有實例中的第一個實例使用子選擇器的第一個實例，:nth-child(1)或:first-child