Häufig verwendete Filtermethoden in JQuery

Filtermethoden, also Funktionen, stimmen größtenteils mit den zuvor eingeführten Filterfunktionen überein

1: get() konvertiert JQuery-Objekte in DOM-Objekte: Setzt die Vordergrundfarbe des zweiten Textes Ist rot

$('li').get(1).style.color = 'red'

2.eq(): Ruft das Element mit der angegebenen Seriennummer ab. Beachten Sie, dass das zurückgegebene Objekt ein jQuery-Objekt ist.

$('li').eq(4).css('color','red')

3.first(): Gibt das erste Element zurück, keine Parameter erforderlich

$('li').first().css('color','red')

4.first(): Gibt das letzte Element zurück, es sind keine Parameter erforderlich

$('li').last().css('color','red')

5.toArray(), gibt ein DOM-Array zurück, beachten Sie, dass es sich nicht um ein JQuery-Objekt handelt

var li = $('li').toArray()
for(var i=0; i<li.length; i++){
li[i].style.color = &#39;green&#39;
}

6 .find(): Gibt alle untergeordneten Elemente zurück, einschließlich Kinder und Enkelkinder...

$('ul').find('li').css('color','coral')
$('ul').find('a').css('color','cyan')

7.children() gibt alle direkten untergeordneten Elemente zurück

$('ul').children().css('color','deeppink')
$('ul').children('p').css('color','deeppink')

8. Für jedes Element ausführen Rückruffunktion

$('li').each(function(){
$(this).css('background-color','wheat')
$(this).css('color','black')
$(this).css('font-size','1.3em')
})

9. Element-Traversal-Methode

//next() nächstes Geschwisterelement

$('li').eq(2).next().css('color','blue')

//alle Geschwisterelemente nach nextAll()

$('li').eq(2).nextAll().css('color','blue')

//siblings(): Gibt alle Geschwisterelemente des ausgewählten Elements zurück, außer sich selbst

$('li').eq(2).siblings().css('color','blue')

Vorwärts durchqueren

//prev(): Vorheriges Geschwisterelement

$('li').removeAttr('style')
$('li').eq(6).prev().css('color','coral')

//prevAll(): Sie müssen es erraten haben, ja, es sind alle vorherigen Geschwisterelemente

$('li').eq(6).prevAll().css('color','coral')

10, fügen Sie Elemente zum hinzu Ausgewählte Sammlung

//Entfernen Sie zuerst die benutzerdefinierten Stile für alle Elemente, setzen Sie die Elemente auf ihre Prototypen zurück und sehen Sie schlicht aus

$('*').removeAttr('style')

//Stellen Sie den gesamten Li-Text auf Rot ein, Sie werden das finden p ist nicht ausgewählt, was normal ist

$('li').css('color','red')

//Wie kann man also das p-Element auswählen? Man kann nur den Auswahlbereich vergrößern und das p-Element in diese Auswahl einfügen

//. Sie können dies mit der Methode add() tun

$('li').add('p').css('color','red')

11. filter() gibt die qualifizierten Elemente aus dem Ergebnis zurück

//Gibt nur das 6. Element zurück

$('li').filter(':eq(5)').css('background-color','lightgreen')

12. Die Funktion von not() ist genau das Gegenteil von filter(). Sie entfernt die Elemente, die die Bedingungen erfüllen

$('li').not(':eq(5)').css('background-color','lightgreen')

13, gibt die Elemente im angegebenen Bereich zurück

$('*').removeAttr('style')

//Einschließlich der Startposition, ohne die Endposition, beträgt die Anzahl der zurückgegebenen Ergebnisse 5-2=3

$('li').slice(2,5).css('background-color','lightgreen')

//Die ersten 4 Elemente abrufen

$('li').slice(0,4).css('background-color','lightgreen')

/ /Omitted Der zweite Parameter reicht standardmäßig vom aktuellen Anfang bis zum Ende

$('li').slice(4).css('background-color','lightgreen')

Das obige ist der detaillierte Inhalt vonHäufig verwendete Filtermethoden in JQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!