jQuery children() Methode
Beispiel
Elemente zurückgeben, die direkte Kinder von <ul> sind:
$(document).ready(function(){
$("ul").children().css({"color": "red", "border": "2px solid red"});
});
Ergebnis:
body (great-grandparent)
div (grandparent)
ul (parent)
- li (child)
span (grandchild)
Definition und Verwendung
Die children()-Methode gibt alle direkten Kinder des ausgewählten Elements zurück.
Der DOM-Baum: Diese Methode durchläuft den DOM-Baum nur eine Ebene nach unten. Um mehrere Ebenen nach unten zu durchlaufen (um Enkelkinder oder andere Nachkommen zurückzugeben), verwenden Sie die Methode find() .
Tipp: Um eine einzelne Ebene im DOM-Baum nach oben oder ganz nach oben zum Wurzelelement des Dokuments zu gehen (um Eltern oder andere Vorfahren zurückzugeben), verwenden Sie die parent()- oder parent( )- Methode.
Hinweis: Diese Methode gibt keine Textknoten zurück. Um alle untergeordneten Elemente einschließlich Textknoten zurückzugeben, verwenden Sie die Methode content() .
Syntax
$(selector).children(filter)
| Parameter | Description |
|---|---|
| filter | Optional. Specifies a selector expression to narrow down the search for children |
Probieren Sie es selbst aus - Beispiele
zurückgeben Wie man alle direkten Kinder eines <ul>-Elements zurückgibt.
eingrenzen So verwenden Sie den Filterparameter, um alle <li>-Elemente mit dem Klassennamen "first" zurückzugeben, die direkte Kinder von <ul> sind.
So wählen Sie alle <p>-Elemente aus, die direkte Kinder ihres übergeordneten <div>-Elements sind.
Eine Demonstration, die zeigt, wer die Nachkommen eines <div>-Elements tatsächlich sind.