Heim >Web-Frontend >Front-End-Fragen und Antworten >Welche Methoden verfügt JQuery für den Zugriff auf Knoten?
Knotenzugriffsmethoden: 1.children(), das auf alle direkten untergeordneten Elemente des ausgewählten Elements zugreifen kann; 2.most(), das auf das erste Vorfahrenelement des ausgewählten Elements zugreifen kann; greifen Sie auf die abgeleiteten Elemente des ausgewählten Elements zu; 4. first(), greifen Sie auf das erste Element des ausgewählten Elements zu, 5. last() usw.
Die Betriebsumgebung dieses Tutorials: Windows7-System, jquery1.10.2-Version, Dell G3-Computer.
JQuery-Methoden, die auf Knoten zugreifen können
Methode | Beschreibung |
---|---|
add() | Elemente zum Satz übereinstimmender Elemente hinzufügen |
addBack() | Fügen Sie das Vorherige hinzu Satz von Elementen zum aktuellen Satz | Gibt alle direkten untergeordneten Elemente des ausgewählten Elements zurück (einschließlich Text- und Kommentarknoten)
each() | Führen Sie die Funktion für jedes übereinstimmende Element aus |
end() | Beenden Sie die aktuelle Kette. Die neueste Filterung Operation und bringen Sie den Satz übereinstimmender Elemente in den vorherigen Zustand zurück. |
eq() | Gibt das Element mit der angegebenen Indexnummer des ausgewählten Elements zurück auf neue Elemente reduziert, die dem Rückgabewert des Selektors oder der Matching-Funktion entsprechen |
has() | Gibt alle Elemente zurück, die ein oder mehrere Elemente enthalten. |
is() | Überprüft den Satz übereinstimmender Elemente basierend auf dem Selektor-/Element-/jQuery-Objekt, wenn mindestens eines vorhanden ist passendes Element, Gibt true zurück |
last() | Gibt das letzte Element des ausgewählten Elements zurück |
map() | Übergeben Sie jedes Element im aktuellen Matching-Set an die Funktion und generieren Sie ein neues jQuery-Objekt, das das enthält Rückgabewert |
next() | Gibt das nächste Geschwisterelement des ausgewählten Elements zurück |
nextAll() | Gibt alle Geschwisterelemente nach dem ausgewählten Element zurück |
nextUntil() | Gibt zwischen Alle zurück. si Bling Elemente nach jedem Element zwischen den beiden angegebenen Parametern |
not() | Entfernt das Element aus der Menge der übereinstimmenden Elemente |
offsetParent() | Gibt das erste positionierte übergeordnete Element zurück |
parent() | Gibt das direkte übergeordnete Element des ausgewählten Elements zurück |
parents() | Gibt alle Vorfahrenelemente des ausgewählten Elements zurück |
parentsUntil() | Gibt zwischen zwei gegebenen Alle Vorfahrenelemente zwischen den angegebenen Parametern zurück |
prev() | Gibt das vorherige Geschwisterelement des ausgewählten Elements zurück |
prevAll() | Gibt alle Geschwisterelemente vor dem ausgewählten Element zurück |
prevUntil() | Gibt alle Geschwisterelemente vor jedem Element dazwischen zurück zwei gegebene Parameter |
siblings() | Gibt alle Geschwisterelemente des ausgewählten Elements zurück |
slice() | Reduziert den Satz übereinstimmender Elemente auf eine Teilmenge des angegebenen Bereichs |
Unter diesen gibt es im Allgemeinen sieben Methoden für den Zugriff auf und die Abfrage von Geschwisterelementen: siblings(), next(), nextAll(), nextUntil(), prev(), prevAll(), prevUntil()
<!DOCTYPE html> <html> <head> <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script> </head> <body> <div><span>Hello</span></div> <p class="selected">Hello Again</p> <p>And Again</p> <script> $("p").siblings(".selected").css("background", "yellow"); </script> </body> </html>
next()-Methode <!DOCTYPE html> <html> <head> <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script> </head> <body> <ul> <li>list item 1</li> <li>list item 2</li> <li class="third-item">list item 3</li> <li>list item 4</li> <li>list item 5</li> </ul> <script> $('li.third-item').next().css('background-color', 'red'); </script> </body> </html>
prev()-Methode <!DOCTYPE html> <html> <head> <script type="text/javascript" src="js/jquery-1.10.2.min.js"></script> <style> .siblings * { display: block; border: 2px solid lightgrey; color: lightgrey; padding: 5px; margin: 15px; } </style> <script> $(document).ready(function() { $("li.start").prev().css({ "color": "red", "border": "2px solid red" }); }); </script> </head> <body> <div style="width:500px;" class="siblings"> <ul>ul (父节点) <li>li (兄弟节点)</li> <li>li (类名为"start"的li节点的上一个兄弟节点)</li> <li class="start">li (类名为"start"的li节点)</li> <li>li (兄弟节点)</li> <li>li (兄弟节点)</li> </ul> </div> </body> </html> Es gibt zwei Methoden, um auf untergeordnete Elemente zuzugreifen und diese abzufragen : find() und children() Methode children(): Ruft die direkten Teilmengenelemente unter diesem Element ab
<html> <head> <meta charset="UTF-8"> <title>Document</title> <style> div{ /*background-color: pink;*/ } </style> </head> <body> <div> <span>11</span> <span> <ul> <li class="no1">aaa</li> <li>bbb</li> <li>ccc</li> </ul> </span> <span>222</span> <ul> <li>ddd</li> <li>eee</li> <li>fff</li> </ul> </div> </body> <script src="http://code.jquery.com/jquery-latest.js"></script> <script> // $("div").children(".no1").css({color:'#a61c00',backgroundColor:"#0000ff"}); // console.log($("div").children(".no1")[0]); $("div").find(".no1").css({color:'#a61c00',backgroundColor:"#0000ff"}); console.log($("div").find(".no1")[0]); </script> </html>, der dem gefundenen Element entspricht: [Empfohlenes Lernen: jQuery-Video-Tutorial, Web-Frontend |
Das obige ist der detaillierte Inhalt vonWelche Methoden verfügt JQuery für den Zugriff auf Knoten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!