[jquery] jQuery.extend와 jQuery.fn.extend의 ​​차이점은 무엇입니까?

Program / 글쓴이

두 개의 플러그인을 하나로 병합하고 싶기 때문에 jquery 플러그인 구문을 이해하려고합니다. 간격을 멈추거나 여러 번 실행할 수 있어야하는 깜박이.

어쨌든,이 구문은

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);
        });
    },

이

$.fn.blink = function(options)
    {

first (without =)는 한 번에 여러 메서드를 설정하는 방법 인 것처럼 보이기 때문입니다. 이게 옳은 거니? 또한 내가 여기있는 동안 jquery 객체에 요소와 로직을 추가하는 이유는 무엇입니까?

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

(이것은 타이머 플러그인에서 가져온 것입니다)

답변

jQuery.extend는 추가 기능으로 모든 객체를 확장하는 데 사용되지만 jQuery.fn.extend는 실제로 여러 플러그인 기능을 한 번에 추가하는 jQuery.fn 객체를 확장하는 데 사용됩니다 (각 기능을 개별적으로 할당하는 대신).

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');
    }
});

사용법 : $.abc(). (같은 선택기가 필요하지 않습니다 $.ajax().)

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

사용법 : $('.selector').xyz(). (와 같은 선택기가 필요합니다 $('#button').click().)

주로 구현하는 데 사용됩니다 $.fn.each().

도움이되기를 바랍니다.

답변

jQuery.extend와 jQuery.fn.extend의 ​​차이점은 무엇입니까?

실제로 기본 참조 외에는 아무것도 없습니다. 에서 jQuery를 소스 , 당신은 읽을 수 있습니다 :

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

그래서 어떻게 작동합니까? 설명서를 읽

둘 이상의 개체 내용을 첫 번째 개체로 병합합니다.

속성을 복사하는 for-in-loop 일 뿐이며 중첩 된 객체를 재귀하기위한 플래그가 있습니다. 그리고 또 다른 기능 :

에 하나의 인수 만 제공되는 $.extend()경우 이는 대상 인수가 생략되었음을 의미합니다.

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

따라서 함수가 jQuery자체적 으로 호출되면 (명시 적 대상없이) jQuery 네임 스페이스가 확장됩니다. 그리고 함수가 jQuery.fn(명시적인 대상없이 ) 호출되면 모든 (플러그인) 메서드가있는 jQuery 프로토 타입 객체를 확장합니다.

답변

이 블로그 게시물 에는 멋진 설명이 있습니다.

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

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

인용 부호:

일반적으로 함수의 경우 jQuery 객체를, 메소드의 경우 jQuery.fn 객체를 확장해야합니다. 메소드와 달리 함수는 DOM에서 직접 액세스 할 수 없습니다.

답변

$.fn.something= function{};

jQuery.prototype을 가리키고 “this”를 통해 dom 요소에 액세스 할 수 있습니다. 이제 u를 사용할 수 있으므로 $(selector).something();이것은 다음과 같은 플러그인 기능으로 작동합니다.$(selector).css();

$.something = function{};

jQuery 객체 자체에 속성이나 함수를 추가하고 u는 dom 액세스에 “this”를 사용할 수 없습니다. 이제 u는 다음과 같이 사용할 수 있습니다 $.something(). 이것은 유틸리티 기능으로 작동합니다.$.trim()

그러나 

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

동시에 하나 이상의 함수를 추가 할 수 있으며, 둘 이상의 객체를 제공하는 경우 두 객체 리터럴을 병합하는 데 사용할 수도 있습니다.

답변