Heim > Artikel > Web-Frontend > So fragen Sie alle untergeordneten Elemente mit jquery ab
In jquery können Sie die Methode find() verwenden, um alle untergeordneten Elemente abzufragen. Diese Methode kann alle Teilmengenelemente unter dem angegebenen Element abrufen, einschließlich Teilmengen von Teilmengen. Diese Methode erfordert die Übergabe eines Parameters, um die Ergebnisse zu filtern Um alle Unterelemente zu finden, muss der Parameter auf „*“ gesetzt werden. Die Syntax lautet „$(angegebenes Element).find(“*“)“.
Die Betriebsumgebung dieses Tutorials: Windows7-System, JQuery3.6.1-Version, Dell G3-Computer.
In jquery gibt es zwei Möglichkeiten, untergeordnete Elemente zu finden:
children()-Methode: Ruft die direkten Teilmengenelemente unter diesem Element ab.
find()-Methode: Ruft alle Teilmengenelemente (einschließlich Teilmengen von Teilmengen) ab
Wenn Sie alle untergeordneten Elemente abfragen möchten, können Sie unter anderem nur die Methode find () verwenden. Die Methode
find() gibt die Nachkommenelemente des ausgewählten Elements zurück. (Nachkommen sind Nachkommen, Enkel, Urenkel usw.)
DOM-Baum: Diese Methode durchläuft alle Pfade entlang der Nachkommen des DOM-Elements bis zum letzten Nachkommen ().
Syntax:
$(selector).find(filter)
Parameter | Beschreibung |
---|---|
filter | Erforderlich. Ein Selektorausdruck, ein Element oder ein jQuery-Objekt, das Suchnachkommen filtert. Hinweis: Um mehrere Nachkommen zurückzugeben, verwenden Sie Kommas, um die einzelnen Ausdrücke zu trennen. |
Erläuterung: Der Filterparameter wird zum Filtern der Suchergebnisse verwendet. Sie müssen den Parameter nur auf „*“ setzen, um alle Unterelemente zu finden.
Beispiel: Alle untergeordneten Elemente abfragen
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="js/jquery-3.6.1.min.js"></script> <style> div * { display: block; border: 2px solid lightgrey; color: lightgrey; padding: 5px; margin: 15px; } </style> <script> $(document).ready(function() { $("button").on("click", function() { $("ul").find("*").css({ "color": "red", "border": "2px solid red" }); }); }); </script> </head> <body class="ancestors"> <div style="width:500px;">div (父节点) <ul>ul (指定元素) <li>li (子节点1) <span>span (孙节点1)</span> </li> <li>li (子节点2) <span>span (孙节点2)</span> </li> <li>li (子节点3) <span>span (孙节点3)</span> </li> </ul> </div> <button>选取ul的所有子元素</button> </body> </html>
[Lernempfehlung: jQuery-Video-Tutorial, Web-Frontend-Video]
Das obige ist der detaillierte Inhalt vonSo fragen Sie alle untergeordneten Elemente mit jquery ab. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!