Quels types de sélecteurs existe-t-il dans jQuery ?

Sélecteur jQuery
1. Sélecteur de base
Le sélecteur de base est le sélecteur le plus couramment utilisé et le plus simple dans jQuery. Il utilise l'identifiant, la classe et le nom de la balise de l'élément Find DOM. éléments.
1. Sélecteur d'ID #id
Description : fait correspondre un élément en fonction de l'identifiant donné et renvoie un seul élément (Remarque : dans la page Web, le nom de l'identifiant ne peut pas être répété)
Exemple : $(" #test" ) Sélectionnez l'élément
avec l'identifiant de l'élément de test de test
3. Élément de sélection d'élément
Description : Faites correspondre les éléments en fonction du nom d'élément donné et renvoyez la collection d'éléments
Exemple : $(" p") sélectionne tous les éléments

4. *
Description : fait correspondre tous les éléments et renvoie un ensemble d'éléments
Exemple : $("*") sélectionne tous les éléments
5. selector1 , selector2,...,selectorN
Description : fusionnez les éléments correspondant à chaque sélecteur et renvoyez-les ensemble pour renvoyer l'ensemble d'éléments fusionnés
Exemple : $("p,span,p.myClass") sélectionne tout< p>, et class La collection d'éléments pour la balise

de myClass

2. Sélecteur hiérarchique
Le sélecteur hiérarchique obtient des éléments spécifiques basés sur des relations hiérarchiques. 1. Sélecteur descendant
Exemple : $("p span") sélectionne tous les éléments dans l'élément

il s'agit d'un niveau fils ou d'un niveau petit-fils)
2. Sélecteur d'enfant $("parent>child")
Exemple : $("p>span") sélectionne tous les ; élément (note : le sélecteur enfant sélectionne uniquement les éléments enfants appartenant directement à l'élément parent)
3. Sélecteur frère $("prev+next")
Description : Sélectionnez l'élément suivant immédiatement après l'élément précédent, Renvoie l'ensemble d'éléments
Exemple : $(".one+p") sélectionne l'ensemble d'éléments frères

suivant
avec la classe un. Description : Sélectionnez tous les éléments frères après l'élément précédent et renvoie l'ensemble d'éléments
. 🎜> Exemple : $("#two~p") sélectionne l'ensemble de tous les éléments frères

après l'élément avec l'identifiant deux

trois, sélecteur de filtre

1> ; Sélecteur de filtre de base
1. :firstDescription : Sélectionnez le premier élément et renvoie un seul élémentExemple : $( "p:first") Sélectionne le premier élément

🎜> parmi tous les éléments

2. :last
Description : Sélectionne le dernier élément et renvoie un seul élément
Exemple : $(" p:last") Sélectionne le dernier élément

elements
3. :not(selector)
Description : supprime tous les éléments correspondant au sélecteur donné et renvoie une collection d'éléments
Exemple : $("input:not(.myClass)") Sélectionne les éléments dont la classe n'est pas myClass
4 :even
Description : sélectionne tous les éléments dont l'index est un nombre pair et l'index commence à 0 , renvoie l'ensemble d'éléments
5, : impair
Description : Sélectionnez tous les éléments dont l'index est impair, l'index commence à 0, renvoie l'ensemble d'éléments
6, :eq(index)
Description : Sélectionnez l'index égal à L'élément d'index, le index commence à 0, renvoie un seul élément
7, :gt(index)
Description : Sélectionne l'élément avec un index supérieur à index, l'index commence à 0, renvoie une collection d'éléments
8, :lt( index)
Description : Sélectionnez l'élément dont l'index est inférieur à index. L'index commence à 0 et renvoie la collection d'éléments
9 :focus
Description : Sélectionnez le contenu de l'élément en cours de réception. focus

2> Sélecteur de filtre

1. :contains(text)
Description : Sélectionnez les éléments avec un contenu textuel sous forme de texte et renvoyez une collection d'éléments Exemple : $(" p:contains('I')" ) Sélectionnez les éléments contenant le texte "I" 2. :empty
Description : Sélectionnez les éléments vides qui ne contiennent pas d'éléments enfants ou d'éléments de texte, et renvoyez une collection d'éléments
Exemple : $("p:empty") Sélectionnez Un élément

vide qui ne contient pas d'éléments enfants ni d'éléments de texte (

)
3.
Description : Sélectionnez les éléments contenant les éléments correspondant au sélecteur, renvoyez la collection d'éléments
Exemple : $("p:has(p)") sélectionne l'élément

contenant l'élément

;p>

)
4. :parent
Description : Sélectionnez des éléments contenant des éléments enfants ou du texte et renvoyez une collection d'éléments
Exemple : $("p : parent") Sélectionne les éléments

contenant des éléments enfants ou des éléments de texte (

ou

text

)

3> Sélecteur de filtre de visibilité

1. : caché
Description : Sélectionnez tous les éléments invisibles et renvoyez l'ensemble d'éléments2 :visibleDescription : Sélectionnez tous les éléments visibles et renvoyez l'ensemble d'éléments
4> Sélecteur de filtre d'attribut (collection d'éléments de retour)

1 [attribut]
Exemple : $("p[id]") Sélectionnez l'élément p avec l'attribut id
2. .[attribute=value]Exemple :$("input[name=text]") Sélectionnez l'élément d'entrée avec l'attribut name égal à text3, [attribute!=value]
Exemple : $("input[name!=text]") Sélectionnez l'élément d'entrée dont l'attribut name n'est pas égal à text
4, [attribute^=value]
Exemple : $("input[name^= text] ") Sélectionnez les éléments d'entrée avec des attributs de nom commençant par du texte
5, [attribute$=value]
Exemple : $("input[name$=text]") Sélectionnez des éléments d'entrée avec des attributs de nom se terminant par du texte
6. [attribut*=value]
Exemple : $("input[name*=text]") Sélectionnez l'élément d'entrée avec l'attribut name contenant du texte
7.[attribute~=value]
Exemple : $("input[class~=text]") Sélectionnez l'élément d'entrée qui contient du texte dans la valeur séparée par des espaces de l'attribut de classe
8, [attribute1][attribute2][attributeN]
Description : Fusionner plusieurs sélecteurs de filtre d'attribut
5> Sélecteur de filtre d'attribut d'objet de formulaire (renvoie la collection d'éléments)
1.:enabled
Description : Sélectionnez tous les éléments disponibles
2.: désactivé
Description : Sélectionnez tous les éléments indisponibles
3.:checked
Description : Sélectionnez tous les éléments sélectionnés (cases radio, cases à cocher)
Exemple : $("input:checked" ) Sélectionnez tous les éléments sélectionnés < input> elements
4. :selected
Description : Sélectionnez tous les éléments d'option sélectionnés (liste déroulante)
Exemple : $("select option:selected") Sélectionnez tous les éléments d'option sélectionnés
4. Sélecteur de formulaire (renvoie la collection d'éléments, utilisation similaire)
1 :text
Description : sélectionne toutes les zones de texte sur une seule ligne
Exemple : $(":text") sélectionne toutes les zones de texte simples. -zones de texte en ligne
2. :mot de passe
Description : sélectionne toutes les cases de mot de passe
3 : bouton
Description : sélectionne tous les boutons
4 , :checkbox
Description : sélectionne toutes les cases à cocher.

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!