Was sind die Filterselektoren?

Zu den Filterselektoren gehören: erstes Kind, :letztes Kind, :ntes Kind, ntes letztes Kind, :nur untergeordnetes Kind, :nicht, :leer, :markiert, :aktiviert, :deaktiviert und :Fokus warten . Detaillierte Einführung: 1. :first-child, wählt das erste untergeordnete Element unter dem übergeordneten Element aus 2. :last-child, wählt das letzte untergeordnete Element unter dem übergeordneten Element aus usw.

Das Betriebssystem dieses Tutorials: Windows 10-System, DELL G3-Computer.

In der Webentwicklung werden Filterselektoren verwendet, um DOM-Elemente basierend auf bestimmten Bedingungen oder Regeln zu filtern und auszuwählen. Filterselektoren können Entwicklern dabei helfen, bei Bedarf bestimmte Elemente zur Bearbeitung, Stiländerung oder anderen Verarbeitung auszuwählen. Im Folgenden sind gängige Filterselektoren aufgeführt:

1. :first-child: Wählen Sie das erste untergeordnete Element unter dem übergeordneten Element aus. Wählen Sie beispielsweise das erste untergeordnete Element unter allen übergeordneten Elementen aus:

   :first-child {
     /* 样式 */
   }

2 :last-child: Wählen Sie das letzte untergeordnete Element unter dem übergeordneten Element aus. Wählen Sie beispielsweise das letzte untergeordnete Element unter allen übergeordneten Elementen aus:

   :last-child {
     /* 样式 */
   }

3 :nth-child(n): Wählen Sie das n-te untergeordnete Element unter dem übergeordneten Element aus. Der Wert von n kann mithilfe spezifischer Zahlen oder Formeln angegeben werden. Wählen Sie beispielsweise das 3. untergeordnete Element unter dem übergeordneten Element aus:

   :nth-child(3) {
     /* 样式 */
   }

4 :nth-last-child(n): Wählen Sie das n-te untergeordnete Element von unten unter dem übergeordneten Element aus. Ähnlich wie bei :nth-child können Sie bestimmte Zahlen oder Formeln verwenden, um den Wert von n anzugeben. Wählen Sie beispielsweise das vorletzte untergeordnete Element unter dem übergeordneten Element aus:

   :nth-last-child(2) {
     /* 样式 */
   }

5 :only-child: Wählen Sie das einzige untergeordnete Element unter dem übergeordneten Element aus. Wenn Sie beispielsweise nur ein untergeordnetes Element unter allen übergeordneten Elementen auswählen:

   :only-child {
     /* 样式 */
   }

6 :not(selector): Wählen Sie Elemente aus, die den angegebenen Selektor nicht erfüllen. Als Argumente können verschiedene Selektoren verwendet werden, um bestimmte Elemente auszuschließen. Wählen Sie beispielsweise alle Elemente aus, die keine „“-Tags sind:

   :not(a) {
     /* 样式 */
   }

7: Wählen Sie Elemente aus, die keine untergeordneten Elemente oder Textinhalte haben. Wählen Sie beispielsweise alle Elemente aus, die keine untergeordneten Elemente haben:

   :empty {
     /* 样式 */
   }

8 :checked: Wählen Sie ausgewählte Formularelemente aus (z. B. Kontrollkästchen oder Optionsfelder). Aktivieren Sie beispielsweise alle aktivierten Kontrollkästchen:

   :checked {
     /* 样式 */
   }

9. :aktiviert und :deaktiviert: Wählen Sie verfügbare und nicht verfügbare Formularelemente aus. Wählen Sie beispielsweise alle verfügbaren Eingabefelder aus:

   :enabled {
     /* 样式 */
   }

10 :focus: Wählen Sie das aktuell fokussierte Element aus. Wählen Sie beispielsweise das aktuell fokussierte Eingabefeld aus:

:focus {

​ /* Style*/

}

Es ist zu beachten, dass die Unterstützung und Syntax von Filterselektoren je nach Browser und CSS-Version variieren kann. anders. Bei der Verwendung von Filterselektoren wird empfohlen, zunächst Kompatibilitätstests und -überprüfungen durchzuführen.

Zusammenfassend lässt sich sagen, dass Filterselektoren Entwicklern helfen können, DOM-Elemente basierend auf bestimmten Bedingungen oder Regeln zu filtern und auszuwählen. Zu den gängigen Filterselektoren gehören: first-child, :last-child, :nth-child, :nth-last-child, :only-child, :not, :empty, :checked, :enabled, :disabled und :focus wait. Je nach Bedarf und Szenario können durch Auswahl des geeigneten Filterselektors DOM-Elemente genauer ausgewählt und entsprechende Vorgänge und Stiländerungen durchgeführt werden.

Das obige ist der detaillierte Inhalt vonWas sind die Filterselektoren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!