我感覺前面都沒答到點子上。

<div class="left first-div">
??????? <div class="div">
??????????? <a>:first-child</a>
??????????? <a>第二個元素</a>
??????????? <a>:last-child</a>
??????? </div>
??????? <div class="div">
??????????? <a>:first-child</a>
??????? </div>
??????? <div class="div">
??????????? <a>:first-child</a>
??????????? <a>第二個元素</a>
??????????? <a>:last-child</a>
??????? </div>
??? </div>

因為.first-div的第一個子元素是<div class="div">，$(".first-div：first-child")選中的是???????

?????? <div class="div">
??????????? <a>:first-child</a>
??????????? <a>第二個元素</a>
??????????? <a>:last-child</a>
??????? </div>

所以你會看到第一個盒子里的字全變成紫色了，如果刪掉<div class="div">，變成如下

<div class="left first-div">
??????????? <a>:first-child</a>
??????????? <a>第二個元素</a>
??????????? <a>:last-child</a>
??????? <div class="div">
??????????? <a>:first-child</a>
??????? </div>
??????? <div class="div">
??????????? <a>:first-child</a>
??????????? <a>第二個元素</a>
??????????? <a>:last-child</a>
??????? </div>
??? </div>

那你寫的代碼就完全沒有問題

因為$(".first-div a:first child")的意思是選中的元素具備以下條件：1，必須是a元素；2，這個a元素還得是父級元素的第一個元素，否則選不中。

因為這個題只寫了a標簽，如果還寫了其他標簽，就要按照具體要求選擇出第一個a標簽

????$(":first-child")????
?這個選擇器選擇的是【在同一個父級元素】下的【所有子元素中】的【第一個元素】，所以前面的選擇器應該選中的是【所有元素】這一塊，而不是【父級元素】例如：
?<ul>
?????<li></li>
?????<li></li>
?????<li></li>
?????<li></li>
?</ul>
??要用這個選擇器選中第一個【li】，那么應該先選出【同一個父級元素】下的【所有元素】也就是【所有的li】，
??因此前面是
??$("ul?li");
??然后再從【所有li】里面選出第一個【li】，也就是
??$("ul?li:first-child");
?
?并不是CSS中的.firstChild這個屬性，看清楚了哈

$(".first-div：first-child").css("color", "#CD00CD")這個查找的是.first-div下面的所有的第一個元素，包括他的第一個子元素，也包括他的所有后代元素里面的所有第一個元素

因為a是要被查找的元素，查找使用的方法是(":first-child")。