Sélecteur jQuery : explication détaillée des cas d'utilisation de l'enfant unique

Vue d'ensemble

Si un élément est le seul élément enfant de l'élément parent, il sera mis en correspondance.

Si l'élément parent contient d'autres éléments, il ne sera pas mis en correspondance.

Exemple

Description :

Trouver li qui est le seul élément enfant dans ul

Code HTML :

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

jQuery Code :

$("ul li:only-child")

Résultat :

[ <li>Glen</li> ]

Ce sélecteur correspondra au seul élément enfant de l'élément parent. Si son élément parent contient d'autres éléments, il ne sera pas mis en correspondance.

Structure grammaticale :

$(":only-child")

Ce sélecteur est généralement utilisé en conjonction avec d'autres sélecteurs, tels que sélecteur de classe, sélecteur d'élémentAttendez. Par exemple :

$("li:only-child").css("color","blue")

Le code ci-dessus peut définir la couleur de la police dans l'élément li sous l'élément ul avec un seul élément li sur bleu.

Remarque : Il est nécessaire d'expliquer le concept en combinaison avec le code ci-dessus. L'élément parent mentionné ici n'est pas li, mais l'élément parent de li. Beaucoup de gens pensent souvent à tort qu'il correspond au dernier élément parmi les éléments enfants de l'élément li.

Exemple de code :

  

    
ASP教程
  
  

    
html教程
    
DIV+CSS教程
    
jQUERY教程
    
jAVAScript教程
  

点击查看效果

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!