Résumé des points de connaissances sur Selector dans jQuery

Résumé de JQuery Selector, les amis dans le besoin peuvent s'y référer, ce sont des méthodes de contrôle de sélection couramment utilisées.

//jQuery selector$
//$(expression,[context]) return jQuery
//Unit One
//Le définisseur CSS d'expression consiste à exprimer l'élément à sélectionner en CSS syntaxe

// $("*"); // Représente toutes les balises d'éléments de la page
// $("th, td") // Représente toutes les balises d'élément
// $("a") // Représente toutes les balises d'élément
// $("p#onlyp"); // Représente les éléments avec id=onlyidv dans la sélection CSS $( "#ID ") correspond à l'intégralité du document
// $("#rating"); // Représente l'élément avec id=rating
// $("#orderedlist > li"); tous les éléments avec des éléments enfants id=orderedlist, mais n'incluant pas les éléments enfants sous l'élément enfant
// $("#orderedlist li:last"); // Représente le dernier élément de li dans id=orderedlist
/ / $("#orderedlist li :first"); //Représente le premier élément de li dans id=orderedlist
// $("#orderedlist li:nth- child(0)"); N) élément de li dans id=orderedlist L'élément n est l'indice du tableau
// $("button:only-child"); //Indique que c'est le seul élément du conteneur parent dans la sélection CSS
// $(".stuff:empty" ); // Représente les éléments vides dans la sélection CSS
// $(".buttons:enabled"); // Représente les éléments normalement activés dans la sélection CSS
/ / $(".buttons:disabled" ); // Représente les éléments non activés dans la sélection CSS
// $("input:checked"); // Représente les éléments sélectionnés dans la sélection CSS
// $( "button:not(.not )"); // Indique la suppression des éléments dans not() dans la sélection css
// $("button.not"); // Indique les éléments avec class=not dans css selection $(".CLSS" ) correspond à l'intégralité du document
// $("#orderedlist2 li"); // Indique tous les éléments enfants de id=orderedlist et inclut les éléments enfants de tous les éléments enfants
// //alert($("#orderedlist ~ li").length);
// $("#orderedlist,.buttons,li"); //Éléments correspondant au sélecteur css



//expression de Select basée sur les attributs de l'élément
// alert($("button[@class]").length); // Indique les éléments avec des attributs de classe
// alert($( "button[@class=not" ).length); // Indique un élément avec un attribut de classe et une valeur égale à not
// alert($('button[@class^=not').length) ; // Indique un élément avec un attribut de classe et une valeur qui correspond au début L'élément de not
// alert($('button[@class$=not').length); avec l'attribut de classe et la fin de la valeur correspondant à not
// alert($('button [@class*=not').length); // Indique les éléments avec des attributs de classe et des valeurs qui correspondent à not //Expression XPATH
filtre Syntaxe XPATH pour représenter les éléments de page qui doivent être sélectionnés //$("ol[@id^='orderedlist']").find("li: contient('First')").each(function(i) {
//// $ (this).html( $(this).html() + " BAM! " + i );
// $(this).mouseover(function(){
// $(this).css ("color","red");
// }
// $(this). ).mouseout(function(){
// $(this).css("color", "#000");
// }
// }); /Trouver tous les éléments avec la balise ol et l'attribut id=orderedlist. Il existe deux façons de l'écrire
//ol [@id='orderedlist'] Pour localiser l'élément parent, utilisez directement chaque itération
// ol[@id='orderedlist']/* Pour tous les éléments enfants sous l'élément parent, utilisez find('child- element').each( )Iterate

//Unit two
/// $( html, [ownerDocument]) return jQuery
//Cette fonction permet de passer un
élément html
texte, constructeur Un objet jQuery créé par ce texte HTML sera généré. Cet objet peut ne pas exister à l'origine, ou il peut exister sur la page d'origine //$('

hello

').appendTo("h2 "); //Générer un texte de balisage et l'ajouter à la balise h2 du page//Vous pouvez également supprimer l'élément de page d'origine et l'ajouter
//$("input",this).appendTo("h2"); //Notez que les éléments de page supprimés ici sont déplacé ! plutôt que copié

///$(elements) return jQuery
//Cette fonction permet le passage direct dans le DOM
//$( document.forms[0].elements). appendTo("h2"); // Vous pouvez vous référer au document DOM
//$(callback) return jQuery



//Ce qui suit est Quelques instructions pour le sélecteur
/*
Bases :

#id : Récupère l'objet en fonction de son attribut id.
element : Tous les objets qui correspondent à une certaine
balise HTML
.class : Récupère l'objet en fonction de l'attribut de classe de l'objet * : Récupère tous les objets
selector1, selector2, selectorN : Obtenez une collection de plusieurs sélecteurs sans supprimer les doublons

Sélecteur hiérarchique :
ancêtre descendant : Ce sélecteur est un espace, ce qui signifie que tous les objets du premier sélecteur sont trouvés en premier, puis Rechercher tous les objets qui correspondent au deuxième sélecteur parmi les nœuds descendants de .
parent > enfant : ce sélecteur est le signe supérieur à, ce qui signifie qu'il faut d'abord rechercher tous les objets du premier sélecteur, puis rechercher tous les objets qui correspondent au deuxième sélecteur dans ses nœuds enfants (pas de grands nœuds).
prev + next : Ce sélecteur est le signe plus, ce qui signifie qu'il faut d'abord rechercher tous les objets du premier sélecteur, puis rechercher les objets qui suivent le nœud suivant du même niveau et correspondent également au deuxième sélecteur.
prev ~ frères et sœurs : ce sélecteur est le signe ~, ce qui signifie qu'il faut d'abord rechercher tous les objets avec le premier sélecteur, puis rechercher les objets qui correspondent au deuxième sélecteur dans tous les nœuds suivants au même niveau.

Caractères de filtre de base :
:first : faire correspondre le premier objet parmi plusieurs objets
:last : faire correspondre le dernier objet parmi plusieurs objets
:not(selector) : faire correspondre les éléments avec le contenu dans le sélecteur après non supprimé
: pair : correspond au nombre pair parmi tous les objets
: impair : correspond au nombre impair parmi tous les objets
: eq(index) : correspond à un certain Un seul élément dans ce qui suit table
:gt(index) : correspond à tous les éléments supérieurs à un certain indice
:lt(index) : correspond à tous les éléments inférieurs à un certain indice
:header : correspond à tous les éléments d'en-tête, par exemple, h1 , h2, h3, h4, h5, h6
:animated : correspond à tous les éléments animés

filtre de texte :
:contains(text) : correspond à l'élément de texte qui a le contenu interne des objets, y compris situations utiles indirectes
:empty : correspond à tous les objets sans éléments enfants
:has(selector) : correspond à tous les objets qui contiennent au moins un sélecteur enfant
:parent : correspond à tous les objets parents, l'objet parent contient ceux objets qui contiennent uniquement du texte

Filtre de visibilité :
:hidden : correspond à tous les objets cachés, ou au type masqué dans l'entrée
:visible : correspond à tous les objets visibles

Filtre d'attribut :
[attribut] : correspond à tous les objets avec un certain attribut
[attribute=value] : correspond aux objets avec un certain attribut et une certaine valeur
[attribute!= value] : correspond aux objets qui ont un certain attribut et n'ont pas une certaine valeur
[attribute^=value] : fait correspondre les objets qui ont un certain attribut et commencent par une certaine valeur
[attribute$=value] : fait correspondre les objets qui ont un certain attribut et se terminent par une certaine valeur value
[attribute*=value] : faire correspondre les objets qui ont un certain attribut et contenir une certaine valeur
[selector1] [selector2][selectorN] : faire correspondre les objets qui correspondent à plusieurs sélecteurs d'attribut en même temps

sous-filtre :
:nth- child(index/even/odd/equation) : correspond à un certain indice /even/odd/ dans l'élément enfant Pour les objets équation, :eq(index) ne peut correspondre qu'au caractéristiques d'un élément enfant d'un seul objet, tandis que cette méthode peut faire correspondre les caractéristiques communes d'un certain élément enfant de plusieurs objets
 : premier enfant : correspondre au premier élément enfant
 : dernier - child : correspond au dernier élément enfant
Ces deux matchers peuvent également correspondre à tous les éléments enfants de plusieurs objets parents
: only-child : if Si un élément parent n'a qu'un seul élément enfant, il correspondra à cet élément enfant

filtre de formulaire
Type de nom

:input Renvoie : Tableau<Élément(s)>
formulaire correspondant Élément d'entrée interne

 : texte Renvoie : Tableau< Element(s)>
Correspond aux éléments dont le type d'entrée est du texte sous la forme

 : mot de passe Renvoie : Array
:radio Renvoie : Tableau<Élément(s)>
Faire correspondre les éléments du formulaire dont le type d'entrée est radio

 : case à cocher Renvoie : Tableau<Élément(s)> 🎜>Faire correspondre les éléments du formulaire dont le type d'entrée est la case à cocher

:submit Renvoie : Tableau<Élément(s)>
Faire correspondre le type d'entrée dans le formulaire L'élément de soumission

:image Renvoie : Tableau<Élément(s)>
L'élément qui correspond à l'image sous la forme

:reset Renvoie : Tableau<Élément(s)>
Match les éléments avec le type d'entrée réinitialiser sous la forme

:bouton Renvoie : Tableau<Élément(s)>
Faire correspondre les éléments avec le bouton de type d'entrée sous la forme

:fichier Renvoie : Tableau<Élément(s) >
correspond aux éléments dont le type d'entrée est un fichier dans le formulaire

:hidden Renvoie : Array correspond aux éléments dont le type d'entrée est masqué dans le formulaire Element ou masqué. zone



:enabled Renvoie : Array correspond à tous les éléments activés

:disabled Renvoie : Array
correspond à tous les éléments non activés

:checked Renvoie : Array
correspond à tous les éléments cochés

:selected Renvoie : Array
correspond à tous
liste déroulante
éléments sélectionnés

*/

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!