Maison  >  Article  >  interface Web  >  Une brève discussion sur l'utilisation de $.extend() dans jQuery

Une brève discussion sur l'utilisation de $.extend() dans jQuery

青灯夜游
青灯夜游avant
2020-11-18 17:49:252290parcourir

Cet article résume certaines utilisations de jQuery $.extend() pour tout le monde. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il sera utile à tout le monde.

Une brève discussion sur l'utilisation de $.extend() dans jQuery

Recommandations associées : "jQuery Video"

Deux méthodes pour développer des plug-ins avec JQuery

1. jQuery.extend(object); Pour étendre la classe jQuery elle-même, ajoutez de nouvelles méthodes à la classe.

2. jQuery.fn.extend(object); Ajouter des méthodes aux objets jQuery.

jQuery.fn

jQuery.fn = jQuery.prototype = {
    init: function(selector, context) {
        //内容
    }
}

jQuery.fn = jQuery.prototype. O(∩_∩)O Haha~, connaissez-vous ce prototype ? !

Bien que JavaScript n'ait pas de concept clair de classes, il est plus pratique d'utiliser des classes pour le comprendre. jQuery est une classe très bien encapsulée. Par exemple, si nous utilisons l'instruction $("#p1"), une instance de la classe jQuery sera générée.

jQuery.extend(object)

Ajouter une classe au La méthode de classe jQuery peut être comprise comme l'ajout d'une méthode statique.

Châtaigne①

jQuery.extend({
    min: function(a, b) {
        return a < b ? a : b;
    },
    max: function(a, b) {
        return a > b ? a : b;
    }
});
jQuery.min(2, 3); //  2 
jQuery.max(4, 5); //  5

jQuery.fn.extend(object);

Ajoutez simplement des "fonctions membres" à la classe jQuery. Seule l'instance de la classe jQuery peut appeler cette "fonction membre".

Chestnut②

Par exemple, nous souhaitons développer un plug-in pour créer une zone d'édition spéciale Lorsque vous cliquez dessus, il alertera le contenu de la zone d'édition actuelle. Vous pouvez faire ceci :

$.fn.extend({
    alertWhileClick: function() {
        $(this).click(function() {
            alert($(this).val());
        });
    }
});
//$("#input1")是jQuery的实例,调用这个扩展方法
$("#input1").alertWhileClick();

L'appel à jQuery.extend() n'étendra pas la méthode à l'instance de l'objet. La méthode pour le référencer doit également être implémentée via la classe jQuery, comme jQuery. .init()

L'appel de jQuery.fn.extend() étend la méthode au prototype de l'objet, donc lorsqu'un objet jQuery est instancié, il dispose de ces méthodes, ce qui se reflète partout dans jQuery. JS

jQuery.fn.extend = jQuery.prototype.extend

Vous pouvez étendre un objet dans jQuery prototype, Dans ce cas, il s'agit du mécanisme de plug-in.

Chestnut③

(function($) {
    $.fn.tooltip = function(options) {};
    //等价于 var
    tooltip = {
        function(options) {}
    };
    $.fn.extend(tooltip) = $.prototype.extend(tooltip) = $.fn.tooltip
})(jQuery);

Pour plus de connaissances liées à la programmation, veuillez visiter : Cours vidéo de programmation ! !

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!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer