Eine kurze Diskussion über den Unterschied zwischen jquery selector :first und :first-child

Ein Beispiel:

<ul>
 <li>John</li>
 <li>Karl</li>
 <li>Brandon</li>
</ul>
<ul>
 <li>Glen</li>
 <li>Tane</li>
 <li>Ralph</li>
</ul>

first bedeutet das erste (nach dem Zusammenführen aller übergeordneten Elemente); das erste untergeordnete Element bedeutet (jedes übergeordnete Element) zuerst

$('ul li:first') gibt die Li zurück, in der sich John befindet. Finden Sie das erste li-Element unter allen ul

$("ul li:first-child"). Geben Sie John Glen zurück. Suchen Sie unter jedem ul das erste Element, das das li-Element und das dom-Element ist.

Erweiterte Verwendung: $("body *:first") gibt das erste untergeordnete Element unter body an. $("body *:first-child") gibt an, dass jedes Element unter body das erste untergeordnete Element von ist das Element

Darüber hinaus ist der CSS-Selektor von rechts nach links, wenn ja; :first-child") gibt nur John zurück. Suchen Sie das erste untergeordnete Element von jedem, wenn es ein li-Element ist, wird es das tun Übereinstimmung, sonst wird es nicht übereinstimmen.

<ul>
 <li>John</li>
 <li>Karl</li>
 <li>Brandon</li>
</ul>
<ul>
 
<div>DIV</div>
 <li>Glen</li>
 <li>Tane</li>
 <li>Ralph</li>
</ul>

$('li:first') entspricht dem ersten li-Element $("li:first-child") entspricht dem ersten li-Element, das das erste untergeordnete Element von ist ein Element