Résumé de l'utilisation de JQuery $()

Cette fois, je vais vous apporter un résumé de l'utilisation de JQuery $(). Quelles sont les précautions lors de l'utilisation de JQuery $(). Ce qui suit est un cas pratique, jetons un coup d'œil.

Utilisation de JQuery $() : Il existe trois types principaux : prendre des expressions, prendre des éléments et prendre des fonctions.

1. Sélecteur de balise$('p'), Sélecteur de classe$('.myClass'), sélecteur d'identifiant $(' #myId') est relativement simple, pas grand chose à dire. Mais il y a une chose : il y a une différence entre $('p>ul') et $('p ul').

$('p>ul') est le descendant direct de cebab5b0111e83e5ad6317719ec10a30 et $('p ul') recherche ff6d136ddc5fdfeffaf53ff6ee95f185 parmi tous les descendants de e388a4556c0f65e1904146cc1a846bee.
Donc, $('#sId>li') sélectionne tous les nœuds enfants 25edfb22a4f469ecb59f1190150159c6 avec l'identifiant "sId". Même si les descendants de ce 25edfb22a4f469ecb59f1190150159c6 il sélectionne. La portée de la recherche (l'objet DOM trouvé est uniquement l'objet DOM de son propre niveau.). Et $('#sId li:not(.horizontal)') signifie que tous les descendants de li dans le nom de classe "sId" n'ont pas tous les éléments de la classe horizontale. ——not() voici une négation pseudo-classe.

Ce qui est renvoyé ici est un objet jQurey, un objet tableau. La longueur de cet objet jQuery peut être obtenue avec .length().

2. ] est l'attribut de l'élément ; c'est un
sélecteur d'attribut
Il n'y a pas de @ dans [], indiquant que [] est le descendant de l'élément. Bien que $('ul li') et $('ul[li]') renvoient tous deux un tableau jQuery, leurs significations sont exactement le contraire. La première consiste à trouver tous les descendants de 25edfb22a4f469ecb59f1190150159c6 sous ff6d136ddc5fdfeffaf53ff6ee95f185, tandis que la seconde consiste à trouver le tableau ff6d136ddc5fdfeffaf53ff6ee95f185 dont les descendants sont 25edfb22a4f469ecb59f1190150159c6.
Dans XPath, si vous souhaitez trouver un attribut "commençant par...", utilisez ^=. Si vous souhaitez trouver un élément d'entrée dont l'attribut name commence par mail, utilisez
$('input[@. name^ ="mail"]')
Pour trouver un attribut qui "se termine par...", utilisez $=
Pour trouver un attribut qui n'a ni début ni fin, utilisez *=
3. Les sélecteurs qui n'appartiennent pas aux CSS et XPath mentionnés ci-dessus sont des sélecteurs personnalisés, représentés par ":". Ceux utilisés ici sont : first, :last, :parent, :hidden, :visible, :odd, :even , : not('xxx'), ":eq(0)" (commence à 0), :nth(n), :gt(0), :lt(0), :contains("xxx")
Par exemple : $('tr:not([th]):even') désigne les éléments pairs de tous les descendants de l'élément a34de1251f0d9fe1e645927f19a896e8 qui n'incluent pas les descendants de b4d429308760b6c2d20d6300079ed38e il y en a quelques autres, simples Pas besoin d'expliquer



Il y en a une autre, qui est end(). Cette méthode doit être utilisée lorsqu'un nœud DOM effectue une action et souhaite ensuite l'exécuter. sur le nœud qui lui est associé. Actions similaires, end() est utilisée ici. Après avoir utilisé la méthode end(), ce qui est renvoyé est le nœud parent du nœud qui effectue l'action. Par exemple

$(...).parent().find(...).addClass().end()

$('th').parent()—— 
$(&#39;td:contains("Henry")&#39;).prev()——内容包含有"Henry"的<td>的上一个节点 
$(&#39;td:contains("Henry")&#39;).next()——内容包含有"Henry"的<td>的下一个节点 
$(&#39;td:contains("Henry")&#39;).siblings()——内容包含有"Henry"的<td>的所有兄弟节点

Le nœud qui effectue l'action ici est find(...), qui est un objet tableau, l'action qu'il effectue est "addClass()", puis end() est utilisé. À ce moment, le contenu renvoyé pointe vers le nœud pointé par parent(), c'est-à-dire "addClass()". l'action est effectuée. Le nœud parent de cet objet tableau.

5. Pour accéder directement aux éléments DOM, vous pouvez utiliser la méthode get(0), telle que
$('#myelement').get(0), qui peut également être abrégée en $('#myelement ')[0] ​ ​ ​  


Je pense que vous maîtrisez la méthode après avoir lu le cas présenté dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Comment exploiter les attributs de largeur et de hauteur de la page, de la zone visuelle, de l'écran, etc.

Comment utiliser le stockage Web Storage

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!