Maison > Article > interface Web > Quels sont les trois types de sélecteurs dans jquery ?
Les trois sélecteurs de jquery : 1. Le sélecteur de base, qui comprend l'ID de l'élément, le nom de l'élément, le nom de la classe et plusieurs sélecteurs ; 2. Le sélecteur hiérarchique, qui obtient les éléments via la relation hiérarchique entre les éléments du DOM ; 3. Les sélecteurs de filtrage, selon ; différentes règles de filtrage, peuvent également être divisées en filtrage simple, filtrage de contenu, filtrage visible, filtrage d'attributs, filtrage de formulaire, etc.
L'environnement d'exploitation de ce tutoriel : système Windows 7, jquery version 1.10.2, ordinateur Dell G3.
Il se compose de l'ID de l'élément, du nom de l'élément et de plusieurs sélecteurs. Grâce au sélecteur de base, la plupart des éléments de la page peuvent être recherchés
element | |
---|---|
.class | correspond aux éléments en fonction de la classe donnée |
* | Match all elements |
selector1, selectorN | Faites correspondre chaque sélecteur aux éléments et retournez-les ensemble |
2. Sélecteur hiérarchique | |
Selector |
parent>enfant | |
---|---|
précédent +next | correspond à tous les éléments adjacents immédiatement après l'élément précédent |
pre~siblings | correspond à tous les éléments frères après l'élément pré |
3 Sélecteur de filtre | |
1) Sélecteur de filtre simple |
ction Description
First () ou: First
last () ou: last | get le dernier élément |
---|---|
Obtenir tous les éléments sauf le sélecteur donné | |
Obtenir tous les éléments avec une valeur d'index paire, le numéro d'index commence à 0 | |
Obtenir tous les éléments avec une valeur d'index impaire , le numéro d'index commence à 0 | |
Obtenir les éléments avec la valeur d'index spécifiée, le numéro d'index commence à 0 | |
Obtenir tout Pour les éléments supérieurs à la valeur d'index donnée, le numéro d'index commence à 0 | |
Obtient tous les éléments inférieurs à la valeur d'index donnée, le numéro d'index commence à 0 | |
Obtient tous les en-têtes Type éléments, tels que h1, h2... Collection d'éléments | |
Obtenez l'élément qui exécute l'effet d'animation | |
2) Sélecteur de filtre de contenu | |
sélecteur |
: contient (texte)
:empty | Obtenez tous les éléments vides qui ne contiennent pas d'éléments enfants ou de texte |
---|---|
Obtenez les éléments correspondants par le sélecteur | |
Obtenez des éléments contenant des éléments enfants ou du texte | |
3) Filtre de visibilité | |
Sélecteur |
: caché
:visble | Obtenir tous les éléments visibles | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Selector | Description de la fonction |
---|---|
[attribut] | Obtenir l'élément contenant l'attribut donné |
[attribut=value] | Obtenir l'élément qui est égal à l'attribut donné qui est un valeur spécifique |
[attribut!=valeur] | Obtenir des éléments qui ne sont pas égaux à l'attribut donné qui est une certaine valeur |
[attribut^=valeur] | Obtenir des éléments qui ne sont pas égaux à la valeur donnée attribut qui commence par une certaine valeur |
[attribute$=value] | Obtenir l'élément où l'attribut donné se termine par une certaine valeur |
[attribute*=value] | Obtenir l'élément où se termine l'attribut donné avec une certaine valeur |
[selector1][selector2][selectorN] | Obtenir des éléments qui répondent à des attributs qui remplissent plusieurs conditions |
5) Filtre de sous-éléments
Pendant le processus de développement de la page, essayez de rencontre Soulignez la nécessité d'une ligne spécifique. Bien que le sélecteur de filtre de base « :eq(index) » puisse être utilisé pour afficher une seule table, il ne peut pas répondre aux besoins de sélection de grandes quantités de données et de plusieurs tables. Afin de réaliser une telle fonction, jQuery peut facilement obtenir un élément dans tous les éléments parents via le sélecteur de filtre d'élément enfant.
Selector | Description de la fonction |
---|---|
:ntième enfant (eq/pair/impair/index) | Obtenez l'élément de position spécifique sous chaque élément parent, le numéro d'index commence à partir de 1 |
:first-child | Obtenez le premier élément enfant sous chaque élément parent |
:last-child | Obtenez le dernier élément enfant sous chaque élément parent |
:only-child | Obtenez un seul élément enfant sous chaque élément parent |
6) Filtre d'attribut d'objet de formulaire
Le sélecteur de filtre d'attribut d'objet de formulaire obtient l'élément via les caractéristiques d'attribut d'un objet dans le formulaire, telles que les attributs activés, désactivés, cochés et sélectionnés.
Selector | Description de la fonction |
---|---|
:activé | Obtenir tous les éléments du formulaire dont les attributs sont disponibles |
:désactivé | Obtenir les éléments du formulaire qui ont un attribut indisponible s |
:checked | Obtenir tous les éléments sélectionnés dans le formulaire |
:selected | Obtenir tous les éléments d'option sélectionnés dans le formulaire |
7) Filtre de formulaire
dans le sélecteur jQuery Le sélecteur de formulaire est introduit dans , spécialement conçu pour les formulaires, il peut être utilisé pour localiser rapidement un objet de formulaire sur la page.
Selector | Description de la fonction |
---|---|
:input | Obtenir toutes les entrées, zone de texte, sélectionner |
:text | Obtenir toutes les zones de texte sur une seule ligne |
: mot de passe | obtenir toutes les cases de mot de passe |
:radio | obtenir tous les boutons radio |
:case à cocher | obtenir les cases à cocher |
:soumettre | obtenir tous les boutons de soumission |
:image | Obtenez-les tous Image domain |
:reset | Obtenir tous les boutons de réinitialisation |
:button | Obtenir tous les boutons |
:file | Obtenir tous les domaines de fichiers |
[Apprentissage recommandé : Tutoriel vidéo jQuery , vidéo frontale Web】
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!