Méthodes de filtrage couramment utilisées dans jquery

Les méthodes de filtrage, c'est-à-dire les fonctions, sont pour la plupart cohérentes avec les fonctions de filtre introduites précédemment

1 : get() convertit les objets jquery en objets DOM : définit la couleur de premier plan du deuxième texte Est rouge

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

2.eq() : Obtient l'élément avec le numéro de série spécifié. Notez que l'objet jQuery renvoyé est

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

3.first() : Renvoie le premier élément, non. paramètres requis

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

4.first() : renvoie le dernier élément, aucun paramètre requis

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

5.toArray(), renvoie un tableau DOM, notez que ce n'est pas le cas un objet jquery

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

6.find() : renvoie tous les éléments descendants, y compris les enfants et petits-enfants...

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

7.children() renvoie tous les éléments enfants directs

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

8. Exécutez la fonction de rappel pour chaque élément

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

9. Méthode de traversée d'élément

//next() élément frère suivant

< 🎜. >

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

//Tous les éléments frères après nextAll()

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

//siblings() : Renvoie tous les éléments frères de l'élément sélectionné, sauf lui-même

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

Traverser vers l'avant

//prev() : l'élément frère précédent

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

//prevAll() : Vous devez l'avoir deviné, oui, ce sont tous les éléments frères précédents. Éléments de niveau

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

10. ajouter (sélecteur), ajouter des éléments à la collection sélectionnée

// Supprimez d'abord tous les éléments Personnalisez le style, remettez l'élément à son état. prototype, et avoir l'air clair

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

//Mettez tout le texte li en rouge, vous constaterez qu'un p n'est pas sélectionné, c'est normal

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

//Alors, comment pouvez-vous sélectionner l'élément p ? Vous pouvez uniquement augmenter la taille de la sélection et placer l'élément p dans cette sélection

//Vous pouvez le faire en utilisant la méthode add()

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

. 11. filter() renvoie les éléments qualifiés du résultat

//Ne renvoie que le 6ème élément

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

12. not() et la fonction filter() est juste le contraire, supprime les éléments. qui remplissent les conditions

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

13. slice(start, end), renvoie la plage d'éléments spécifiée

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

// Y compris la position de départ, sans compter la position de fin, le nombre de résultats renvoyés est 5-2=3

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

//Obtenir les 4 premiers éléments

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

//Omettre le deuxième paramètre, par défaut du courant Du début au fin

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!