jQuery-Selektor: Detaillierte Erläuterung der Anwendungsfälle von Only-Child

Übersicht

Wenn ein Element das einzige untergeordnete Element im übergeordneten Element ist, wird es abgeglichen.

Wenn das übergeordnete Element andere Elemente enthält, wird es nicht abgeglichen.

Beispiel

Beschreibung:

Suchen Sie li, das einzige untergeordnete Element in ul

HTML-Code:

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

jQuery Code:

$("ul li:only-child")

Ergebnis:

[ <li>Glen</li> ]

Dieser Selektor stimmt mit dem einzigen untergeordneten Element des übergeordneten Elements überein. Wenn das übergeordnete Element andere Elemente enthält, wird es nicht abgeglichen.

Grammatikstruktur:

$(":only-child")

Dieser Selektor wird im Allgemeinen in Verbindung mit anderen Selektoren verwendet, z. B. Klassenselektor, ElementselektorWarten. Beispiel:

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

Der obige Code kann die Schriftfarbe im li-Element unter dem ul-Element mit nur einem li-Element auf Blau setzen.

Hinweis: Das Konzept muss in Kombination mit dem obigen Code erläutert werden. Das hier erwähnte übergeordnete Element ist nicht li, sondern das übergeordnete Element von li. Viele Leute denken oft fälschlicherweise, dass es mit dem letzten Element unter den untergeordneten Elementen des li-Elements übereinstimmt.

Beispielcode:

  

    
ASP教程
  
  

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

点击查看效果

Das obige ist der detaillierte Inhalt vonjQuery-Selektor: Detaillierte Erläuterung der Anwendungsfälle von Only-Child. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!