Sự khác biệt giữa jQuery.extend và jQuery.fn.extend?

Tôi đang cố gắng hiểu cú pháp plugin jquery, vì tôi muốn hợp nhất hai plugin thành một. Đèn nháy cũng cần có khả năng dừng lại trong khoảng thời gian hoặc chạy một số lần.

Dù sao, cú pháp này có giống với

jQuery.fn.extend({
    everyTime: function(interval, label, fn, times) {
        return this.each(function() {
            jQuery.timer.add(this, interval, label, fn, times);
        });
    },
    oneTime: function(interval, label, fn) {
        return this.each(function() {
            jQuery.timer.add(this, interval, label, fn, 1);
        });
    },

điều này

$.fn.blink = function(options)
    {

bởi vì có vẻ như phương thức đầu tiên (không có =) là một cách để đặt nhiều phương thức cùng một lúc. Thê nay đung không? Ngoài ra trong khi tôi ở đây Lý do gì để thêm các phần tử và một số logic vào đối tượng jquery?

jQuery.extend({
    timer: {
        global: [],
        guid: 1,
        dataKey: "jQuery.timer",

(đây là từ plugin hẹn giờ)

jQuery.extend được sử dụng để mở rộng bất kỳ đối tượng nào với các chức năng bổ sung, nhưng jQuery.fn.extend được sử dụng để mở rộng đối tượng jQuery.fn, trên thực tế nó thêm một số chức năng plugin trong một lần (thay vì gán từng chức năng riêng lẻ).

jQuery.extend :

var obj = { x: function() {} }

jQuery.extend(obj, { y: function() {} });

// now obj is an object with functions x and y

jQuery.fn.extend :

jQuery.fn.extend( {
        x: function() {},
        y: function() {}
});

// creates 2 plugin functions (x and y)

jQuery.extend({
    abc: function(){
        alert('abc');
    }
});

sử dụng: $.abc(). (Không cần bộ chọn giống như $.ajax().)

jQuery.fn.extend({
    xyz: function(){
        alert('xyz');
    }
});

sử dụng: $('.selector').xyz(). (Yêu cầu bộ chọn như $('#button').click().)

Chủ yếu nó được sử dụng để thực hiện $.fn.each().

Tôi hy vọng nó sẽ giúp.

Sự khác biệt giữa jQuery.extend và jQuery.fn.extend?

Trên thực tế, không có gì ngoài tham chiếu cơ sở của họ. Trong nguồn jQuery , bạn có thể đọc:

jQuery.extend = jQuery.fn.extend = function() { … };

Vì vậy, làm thế nào nó hoạt động? Các tài liệu đọc:

Hợp nhất nội dung của hai hoặc nhiều đối tượng với nhau thành đối tượng đầu tiên.

Nó chỉ là một vòng lặp for-in-loop sao chép các thuộc tính, kết hợp với một cờ để đệ quy các đối tượng lồng nhau. Và một tính năng khác:

Nếu chỉ một đối số được cung cấp $.extend(), điều này có nghĩa là đối số đích đã bị bỏ qua

 // then the following will happen:
 target = this;

Vì vậy, nếu hàm được gọi trên jQuerychính nó (không có đích rõ ràng), nó sẽ mở rộng không gian tên jQuery. Và nếu hàm được gọi trên jQuery.fn(không có đích rõ ràng), nó sẽ mở rộng đối tượng nguyên mẫu jQuery nơi chứa tất cả các phương thức (plugin).

Bài đăng trên blog này có mô tả tốt:

$.fn.extend({
myMethod: function(){...}
});
//jQuery("div").myMethod();

$.extend({
myMethod2: function(){...}
});
//jQuery.myMethod2();

Báo giá:

Theo nguyên tắc chung, bạn nên mở rộng đối tượng jQuery cho các hàm và đối tượng jQuery.fn cho các phương thức. Một hàm, trái ngược với một phương thức, không được truy cập trực tiếp từ DOM.

$.fn.something= function{};

trỏ đến jQuery.prototype và cho phép truy cập các phần tử dom thông qua "this". Bây giờ bạn có thể sử dụng $(selector).something();Vì vậy, điều này hoạt động như chức năng plugin như$(selector).css();

$.something = function{};

thêm một thuộc tính hoặc chức năng vào chính đối tượng jQuery và bạn không thể sử dụng "this" để truy cập dom Bây giờ bạn có thể sử dụng nó như $.something() ; điều này hoạt động như một chức năng tiện ích như$.trim()

nhưng

$.fn.extend({function1(), function2()}) and  $.extend({function1(), function2()}) 

cho phép thêm nhiều hơn 1 hàm cùng lúc, ngoài ra chúng có thể được sử dụng để hợp nhất hai ký tự đối tượng trong trường hợp chúng tôi cung cấp nhiều hơn một đối tượng.