Heim > Artikel > Web-Frontend > Detaillierte Erläuterung der Verwendung von jQuery-Aufwärtsdurchquerung, Abwärtsdurchquerung, Geschwisterdurchquerung und Filterung
1. Nach oben durchqueren - Vorfahrenelemente
① $(selector).parent([filter]): Gibt das direkte übergeordnete Element des mit dem Selektor übereinstimmenden Elements zurück. Die Methode kann einen Filterselektor zum Filtern akzeptieren zurückgegebenes übergeordnetes Element.
② $(selector).parents([filter]): Gibt alle Vorfahrenknoten des übereinstimmenden Elements zurück, bis hin zum HTML-Element des Dokumentstamms. Die Methode kann einen Filterselektor akzeptieren, um die zurückgegebenen Elemente zu filtern Vorfahrenknoten.
Hinweis: Der Unterschied zwischen „parent“ und „parents“ besteht darin, dass „parent“ den direkten übergeordneten Knoten zurückgibt, „parents“ alle Vorgängerknoten und „$("html").parent() den Knoten „document“. , während $ ("html").parents() leer zurückgibt.
③ $(selector).parentUntil([ancestorSelector][,filter]): Gibt alle Ancestor-Knoten zwischen dem passenden Knoten und dem ancestorSelector zurück. Die Methode kann nicht akzeptiert werden Ein Filterselektor zum Filtern der zurückgegebenen Vorfahrenknoten: Wenn ancestorSelector leer ist oder in seinen Vorfahrenknoten kein mit ancestorSelector übereinstimmendes Element gefunden wird, werden alle Vorfahrenknoten zurückgegeben, was der Methode parent() entspricht.
$(selector).parentUtil(element[,ancestorSelector]): Die Verwendung und Bedeutung sind die gleichen wie oben.
④ $(selector).offsetParent(): Gibt das zuletzt positionierte Vorfahrenelement des passenden Elements zurück. Das sogenannte positionierte Vorfahrenelement bedeutet, dass sein CSS-Attribut position festgelegt ist relativ, absolut, fest, spielt hauptsächlich eine große Rolle bei der Berechnung des Versatzes und der Position von Elementen während der Animationspräsentation.
⑤ $(selector).closest(ancestorSelector[,context]): Ruft das nächste Vorfahrenelement ab, das mit ancestorSelector übereinstimmt. Die Methode kann einen Parameterkontext akzeptieren, um den Suchumfang zu steuern. Der Unterschied zur Parents-Methode ist wie folgt:
a.closest sucht ausgehend vom aktuellen Element selbst nach oben
parents beginnt beim übergeordneten Knotenelement.
b.closest durchläuft den DOM-Baum nach oben, bis eine Elementposition gefunden wird, die mit dem ancestorSelector übereinstimmt
parents durchläuft den DOM-Baum nach oben bis zum Stammelement des Dokuments und fügt jedes Vorfahrenelement einer temporären Sammlung hinzu; Wenn ein Selektor angewendet wird, wird die Sammlung basierend auf dem Selektor gefiltert.
c.closest gibt ein jQuery-Objekt zurück, das 0 oder ein Element enthält.
parents gibt ein jQuery-Objekt zurück, das 0, ein oder mehrere Elemente enthält. Das jQuery-Objekt des Elements
Andere Transformationsverwendung:
$(selector).closest(ancestorSelectors[,context]); $(selector).closest(jQuery object); $(selector).closest(element)
2. Durchlauf nach unten – Nachkommenelemente
① .children([childrenSelector]): Gibt die direkten untergeordneten Elemente des Elements zurück , kann die Methode einen Parameter akzeptieren, um die zurückgegebenen untergeordneten Elemente zu filtern.
② .find(descendantSelector): Gibt alle Nachkommenelemente des Elements zurück, die mit DescendantSelector übereinstimmen, bis hinunter zum letzten Nachkommen.
Andere Variantenverwendung:
.find(jQuery object); .find(element);
③ .contents(): Gibt alle untergeordneten Elemente des Elements zurück. Der Unterschied zu untergeordneten Elementen besteht darin, dass der Inhalt Textknoten und Kommentarknoten enthält.
3. Geschwisterdurchquerung - Geschwisterelemente
① .siblings([selector]): Gibt alle Geschwisterelemente des aktuellen Elements zurück, um die zurückgegebenen Brüder zu filtern. Element.
② .next([selector]): Gibt das nächste Geschwisterelement des aktuellen Elements zurück. Die Methode kann einen optionalen Parameter akzeptieren, um die zurückgegebenen Geschwisterelemente zu filtern.
③ .nextAll([selector]): Gibt alle Geschwisterelemente nach dem aktuellen Element zurück. Die Methode kann einen optionalen Parameter akzeptieren, um die zurückgegebenen Geschwisterelemente zu filtern.
④ .nextUntil([selector][,filter]): Gibt alle Geschwisterelemente des aktuellen Elements zurück, bis es auf ein Geschwisterelement trifft, das der Selektorbedingung entspricht. Die Methode kann einen optionalen Parameterfilter zum Filtern akzeptieren zurückgegebene Geschwisterelemente.
⑤ .prev/prevAll/prevUntil hat die gleiche Verwendung und ähnliche Funktionen wie next/nextAll/nextUntil, aber die Suchrichtung ist entgegengesetzt.
4. Filter
① .filter(selector): Filtern Sie die Teilmenge, die die Auswahlbedingungen erfüllt, aus dem aktuellen Satz übereinstimmender Elemente, um den Übereinstimmungsbereich zu reduzieren.
.filter(function(index)): Filtern Sie den aktuell übereinstimmenden Satz von Elementen basierend auf der -Callback-Funktion . Der von der Callback-Funktion übergebene Parameterindex bezieht sich auf den index
Andere Verformungsverwendung:.filter(element|jQueryObject)② .first(): Gibt das erste Element im aktuellen Satz übereinstimmender Elemente zurück. ③ .last(): Gibt das letzte Element im aktuellen Satz übereinstimmender Elemente zurück. ④ .eq(index/-index): Gibt das Element an der angegebenen Position im aktuell übereinstimmenden Elementsatz zurück. Der Index beginnt bei 0, und eine negative Zahl bedeutet eine Sortierung vom Ende zum Anfang. ⑤ .has(selector/element): Gibt einen Satz von Elementen mit bestimmten Unterelementen aus dem aktuellen Satz von Elementen zurück, mit Ausnahme von Elementen, die keine entsprechenden Unterelemente haben. Untergeordnete Elemente können mithilfe des Parameterselektors oder des Elementobjekts abgeglichen werden.
⑥ .is(selector|function(index)|element|jQueryObject): Überprüfen Sie die Elementsammlung basierend auf einem Selektor oder einer Callback-Funktion oder einem Element oder einem jQuery-Objekt, ob sie mindestens eines enthält, das mit dem angegebenen Ausdruck übereinstimmt Element gibt true zurück, andernfalls wird false zurückgegeben, wenn die aktuelle Elementsammlung leer ist oder der Ausdruck leer ist. Diese Methode wird im Allgemeinen in Rückruffunktionen wie der Ereignisverarbeitung-Handler verwendet, um festzustellen, ob es sich um ein bestimmtes Element handelt
⑦ .map(callback(index,domElement)): Entspricht dem aktuellen Element Das Array wird über den Rückgabewert der Callback-Funktion in ein anderes Objektarray konvertiert (unabhängig davon, ob es ein Dom-Element ist oder nicht). Wenn Sie ein gewöhnliches jQueryObject-Array konvertieren möchten, können Sie jQuery.map(array,callback(objectOfArray, indexOfArray))-Methode.
⑧ .not(selector|elements|function(index)|jQuery-Objekt): Löschen Sie Elemente, die der Parameteranpassung entsprechen, aus dem aktuell übereinstimmenden Elementarray. Parameter können Selektor, DOM-Element, gewöhnliche jQuery-Objekte und A sein Rückruffunktion, die eine boolesche Variable zurückgibt.
⑨ .slice(start[,end]): Ruft eine Teilmenge des angegebenen Bereichs aus der aktuell übereinstimmenden Elementmenge ab. Wenn Start und Ende negative Zahlen sind, wird die Elementrichtung vom Ende zum Anfang ermittelt.
Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Verwendung von jQuery-Aufwärtsdurchquerung, Abwärtsdurchquerung, Geschwisterdurchquerung und Filterung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!