Maison >
interface Web >
js tutoriel >
Jquery obtient la configuration et la suppression de l'objet et des attributs du tag_jquery spécifié
Jquery obtient la configuration et la suppression de l'objet et des attributs du tag_jquery spécifié
WBOY
Libérer: 2016-05-16 16:46:23
original
1584 Les gens l'ont consulté
1. Parlons d'abord du concept de JQuery. JQuery a d'abord été créé par un homme nommé John Resig d'Amérique. Plus tard, de nombreux experts JS ont également rejoint l'équipe. En fait, JQuery est une bibliothèque de classes JavaScript. Cette bibliothèque de classes intègre de nombreuses méthodes fonctionnelles, vous pouvez utiliser des codes simples pour obtenir des effets JS complexes.
2. JQuery réalise la séparation des codes. Il n'est pas nécessaire d'ajouter des événements tels que onclick à la page Web pour appeler des fonctions. Vous pouvez directement introduire la bibliothèque de classes JQuery et le code JQuery écrit par vous-même ; 🎜> Par exemple :
$(function( ){ $ ("Élément").click{ function(){ alert("Cliquez sur moi !" } } } ); Dans le code ci-dessus, tant qu'Element est défini, le clic derrière cet élément est l'action alerte ("Cliquez sur moi !") ; de nombreuses opérations dans cette fonction ;
Le signe $ représente ici JQuery, qui est une référence à la bibliothèque de classes. . . C'est ainsi que je le comprends ;
3. Certaines des méthodes de base de JQuery
each(callback) 'Comme une boucle
$("Element").length ; ' Le nombre d'éléments est un attribut
$(“Element”).size(); 'C'est aussi le nombre d'éléments, mais avec des parenthèses c'est une méthode
$( “Element”).get (); 'Une collection d'éléments dans la page, stockés sous la forme d'un tableau
$("Element").get(index); ci-dessus, index représente l'élément, Array index
$(“Element”).get().reverse(); 'Changer la direction du tableau obtenu
$(“Element1″).index ($("Element2 ″)); 'La valeur d'index de l'élément 2 dans l'élément 1 est. . .
4. Acquisition d'objets de base
$(“*”) 'Indique l'obtention de tous les objets
$(“#element”) 'Obtention du même numéro d'identification qu'en CSS
$(".abc") 'Tous les éléments utilisant le style .abc
$("div") 'Le sélecteur de balises sélectionne tous les éléments div
$( "# a,.b,span") 'Indique l'obtention de l'élément avec l'ID a, l'élément utilisant le style de classe b et tous les éléments span
$("#a .b p") 'Le numéro d'identification est a et utilise tous les p éléments du style b
5. Obtention des éléments hiérarchiques
$("Element1 Element2 Element3 ....") 'Le parent devant est suivi du sous-ensemble
$("div > p") 'Obtenir tous les éléments p sous le div
$("div p") 'Le premier élément p après l'élément div
$("div ~ p") 'Tous les éléments p après div
6. Acquisition d'objet simple
$("Element:first") 'Le premier élément d'un certain type d'élément dans la page HTML An element
$("Element:last") 'Le dernier élément d'un certain type d'élément dans la page HTML
$("Element:not(selector)") 'Supprimer tous les éléments avec le donné Spécifiez les éléments correspondants par le sélecteur, tels que : $("input:not(:checked)") signifie sélectionner toutes les cases à cocher non cochées
$("Element:even") 'Obtenir les lignes paires
$("Element:odd") 'Obtenir les lignes impaires
$("Element:eq(index)") 'Obtenir une valeur d'index donnée
$(" Element:gt(index)") 'Obtenir tous les éléments après l'élément avec une valeur d'index donnée
$("Element:lt(index)") 'Obtenir tous les éléments avant l'élément avec une valeur d'index donnée
$("Element:lt(index)") 'Obtenir tous les éléments avant l'élément avec une valeur d'index donnée
. . .
7. Obtention d'objets de contenu et de visibilité des objets
$("Element:contains(text)") 'Si l'élément contient du contenu textuel
$(' Element:empty ") 'Obtenez le
$("Element:partnt") 'Obtenez le
$("Element:has (selector)") 'S'il contient un certain élément, tel que : $("p:has(span)") signifie tous les p éléments contenant des éléments span
$("Element:hidden") 'Sélectionner tous les éléments visibles
$("Element:visible" ) 'Sélectionner tous les éléments invisibles
8. Autres méthodes d'acquisition d'objets
$("Element[id]") 'Tous les éléments avec des attributs ID
$("Element[ attribut = youlika ]" 'Obtenir tous les éléments avec un attribut de youlika
$("Element[attribute != youlika ]" 'Obtenir tous les éléments dont l'attribut n'est pas youlika
$(" Element[attribute ^= youlika]" 'Obtenir tous les éléments dont l'attribut n'est pas youlika
$(" Element[attribute $= youlika ]" 'Obtenir tous les éléments dont l'attribut ne se termine pas par youlika
$("Element[attribute *= youlika ]" 'Obtenir tous les éléments avec un attribut commençant par youlika
$("Element[selector1][selector2][....]") 'Conforme au sélecteur d'attribut, tel que $("input[id][name][value=youlika]") signifie obtenir Les éléments d'entrée avec ID, Nom et valeur sont youlika
Obtention de l'enfant. elements
$("Element:nth-child(index)") 'Sélectionnez celui en dessous du parent Le nième élément
$("Element:nth-child(even)") 'Sélectionnez le nombre pair sous le parent
$("Element:nth-child(odd)") 'Sélectionnez le nombre impair sous le parent
$("Element:nth-child( 3n 1)”) 'Expression
$(“Element:first-child”) 'Sélectionnez le nombre impair en dessous du parent Le premier élément enfant
$("Element:last-child" ) 'Sélectionnez le dernier élément enfant sous le parent
$("Element:only-child") 'Match Le seul élément enfant sous le parent, par exemple, dt est le seul dans la liste dl, puis dt
10. Obtenez l'objet du formulaire $(:input)//Trouver tous les éléments d'entrée, bien sûr, inclure des listes déroulantes, des champs de texte, des boutons radio, des cases à cocher, etc. .
$(:text)//Faire correspondre toutes les zones de texte sur une seule ligne
$(:password)//Faire correspondre toutes les zones de mot de passe
$(:radio)// Faire correspondre tous les boutons radio
$(:checkbox)//Faire correspondre toutes les cases à cocher
$(:submit)//Faire correspondre tous les boutons de soumission
$ (:image)/ /Faire correspondre tous les champs d'image, tels que
$(:reset)//Faire correspondre tous les boutons de réinitialisation
$ (:button)//Faire correspondre tous les boutons
$(:file)//Faire correspondre tous les domaines de téléchargement de fichiers
$(:hidden)//Faire correspondre tous les éléments ou types invisibles Pour les éléments masqués
$( :enabled)//matcher tous les éléments d'entrée disponibles, par exemple radio:enabled signifie faire correspondre tous les boutons radio disponibles
$(:disabled)//match Tous les éléments d'entrée non disponibles ont l'effet inverse de celui ci-dessus
$(:checked)//Faire correspondre tous les éléments de case à cocher sélectionnés
$(:selected)//Faire correspondre toutes les listes déroulantes
11. Définition et suppression des attributs d'élément
$("Element").attr(name) 'Obtient la première valeur d'attribut correspondante, telle que $("img") attr("src")
$("Element".attr). (key,value)”) 'Définir les attributs pour un certain élément
$(“Element”.attr({key:value ,key1:value,….})) 'Définir plusieurs attributs pour un élément à once
$("Element").attr(key,function) 'Définit un attribut calculé pour tous les éléments correspondants Valeur de l'attribut
$("Element").removeAttr(name)/. /Supprimer un attribut
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn