Une brève discussion sur les fonctions principales de Jquery_jquery

Dans Jquery, tous les objets DOM seront encapsulés dans des objets Jquery, et seuls les objets Jquery peuvent utiliser les méthodes ou propriétés Jquery pour effectuer les opérations correspondantes.

Jquery fournit donc une fonction qui peut encapsuler des objets DOM dans des objets Jquery, qui est la fonction principale de Jquery jquery(), également connue sous le nom de fonction d'usine.

La fonction principale de jquery a 7 surcharges, comme suit :

jquery() Cette fonction renvoie un objet jquery vide.
jquery(elements) Cette fonction convertit un ou plusieurs éléments DOM en objets Jquery (ou collections jquery)
jquery(callback) Cette fonction est l'abréviation de jquery(document).ready(callback). Cette fonction liera une fonction qui sera exécutée après le chargement du document DOM. Toutes les opérations jquery sur la page qui doivent être effectuées lorsque le DOM est chargé doivent être incluses dans cette fonction. Cette fonction peut apparaître plusieurs fois sur la page.
jquery(expression,[contexte])
jquery(html)
jquery(html,accessoires)
jquery(html,[ownerDocument])

Regardons-les en détail

jQuery(expression, [contexte])

Cette fonction reçoit une chaîne contenant un sélecteur CSS, puis utilise cette chaîne pour faire correspondre un ensemble d'éléments.

Vous pouvez récupérer un objet DOM via doc[0] et doc[1] respectivement, et les autres sont des propriétés et méthodes uniques aux objets jQuery ; en fait, les objets jQuery enveloppent les objets DOM et incluent également certaines opérations sur les éléments DOM. .méthode jQuery.

Dans le processus d'utilisation de jQuery, la première étape et l'étape la plus importante dans la plupart des cas consiste à obtenir l'objet jQuery qui encapsule l'objet DOM à manipuler, puis à terminer le traitement en appelant la méthode de l'objet jQuery obtenu ; Opérations sur les objets DOM.

par exemple

1. Trouvez tous les éléments avec le nœud p dans le contexte #first, et affichez les valeurs correspondantes dans une boucle.

$(function() {
    var items = $("p", "#first");
    $.each(items, function(i, n) {
      alert(i);
    });
  });

i est l'index correspondant, n est le nœud correspondant

2. Recherchez tous les éléments p, et ces éléments doivent être des éléments enfants de l'élément div.

Code HTML :

un

deux

Code jQuery :

$("div > p");

Résultat :

[

deux

]

3. Dans le premier formulaire du document, recherchez tous les boutons radio (c'est-à-dire : les éléments de saisie avec la radio de valeur de type).

Code jQuery :

$("input:radio", document.forms[0]);
                                                                                                                                  

jQuery(html, [ownerDocument]) Crée dynamiquement un élément DOM enveloppé par un objet jQuery basé sur une chaîne de balisage HTML brute fournie.

Vous pouvez transmettre une chaîne HTML manuscrite, une chaîne créée par un moteur de modèle ou un plugin, ou une chaîne chargée via AJAX.

jQuery(html, accessoires) Crée dynamiquement un élément DOM enveloppé par un objet jQuery basé sur une chaîne de balisage HTML brute fournie. Définissez une série de propriétés, d'événements, etc. en même temps.

Paramètres

htmlString

Chaîne de balise HTML utilisée pour créer dynamiquement des éléments DOM

propsMap

Propriétés, événements et méthodes d'attachement aux éléments nouvellement créés

Exemple

Description :

Créez dynamiquement un élément div (et tout son contenu) et ajoutez-le à l'élément body. Dans cette fonction, la conversion du balisage en élément DOM est réalisée en créant temporairement un élément et en définissant la propriété innerHTML de l'élément sur la chaîne de balisage donnée. Cette fonction présente donc à la fois de la flexibilité et des limites.

Code jQuery :

$("<div>", {
 "class": "test",
 text: "Click me!",
 click: function(){
  $(this).toggleClass("test");
 }
}).appendTo("body");

Abréviation de $(document).ready().

Lorsque le DOM est chargé, exécutez les fonctions qu'il contient.

Code jQuery :

 
$(function(){
 // 文档就绪
});

Ce qui précède représente l’intégralité du contenu de cet article, j’espère que vous l’aimerez tous.