Heim > Artikel > Web-Frontend > Eine kurze Analyse hierarchischer Selektorbeispiele für den Einstieg in jQuery_jquery
In diesem Artikel wird die Verwendung hierarchischer Selektoren beim Einstieg in jQuery analysiert. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:
Hier finden Sie eine kurze Einführung in den Unterschied zwischen Vorfahren, Nachkommen und Eltern>Kind im hierarchischen Selektor von jQuery.
parent>child: Entspricht allen untergeordneten Elementen basierend auf dem übergeordneten Element. Die hierarchische Beziehung ist eine Eltern-Kind-Beziehung.
Vorfahren-Nachkomme: Entspricht allen Nachkommen-Elementen basierend auf Vorfahren-Elementen. Die hierarchische Beziehung besteht aus Vorfahren und Nachkommen.
Schreiben Sie Code und testen Sie ihn, um den Unterschied zwischen den beiden klarer zu erkennen:
<div id="first">1 <span>1.1 </span> <span>1.2 </span> <div>1.3 <span>1.3.1 </span> </div> </div> <script type="text/javascript" src="jquery-1.4.1.min.js"> </script> <script type="text/javascript"> $(function () { $("#first>span").css("color", "red"); }); </script>
Nach dem Ausführen wurde Folgendes gefunden:
Die Textfarbe von 1.3.1 ist nicht rot, da es sich bei „Eltern>Kind“ um eine Eltern-Kind-Beziehung handelt
Wenn Sie den Selektor ändern auf:
Die Textfarbe von 1.3.1 ist ebenfalls rot, da die hierarchische Beziehung der Vorfahren und Nachkommen aus Vorfahren und Nachkommen besteht. Das heißt, alle Span-Tags unter dem Element mit der ID „first“, unabhängig davon, ob es sich um Kinder oder Enkel handelt, werden rot.
Ich hoffe, dass dieser Artikel allen in der jQuery-Programmierung hilfreich sein wird.