jQuery - jQuery의 $.extend 및 $.fn.extend 작용 및 차이

1947 단어 jquery
jQuery는 다음과 같은 두 가지 방법으로 플러그인을 개발합니다.
1. jQuery.fn.extend();
2. jQuery.extend();
 
자바스크립트는 명확한 클래스 개념이 없지만 유사한 클래스의 정의를 구축할 수 있다.
jQuery는 아주 잘 봉인된 클래스입니다. 예를 들어 $("#btn1") 는 jQuery 클래스의 실례를 생성할 수 있습니다. 이 점을 이해하는 것이 매우 중요합니다.
 
(1). jQuery.extend(object); 
이것은 jQuery 클래스에 클래스를 추가하는 방법으로 정적 방법을 추가할 수 있습니다.예:a.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

b. jQuery.extend (target,object1, [objectN]) 는 한 개 이상의 다른 대상으로 한 대상을 확장하고 확장된 대상을 되돌려줍니다.var settings = { validate: false, limit: 5, name: "foo" }; 
var options = { validate: true, name: "bar" }; 
jQuery.extend(settings, options);

결과: settings == { validate: true, limit: 5, name: "bar" } 
(2). jQuery.fn.extend(object);
$.fn은 무엇입니까?
$.fn은 jQuery의 이름 공간을 가리키며 fn의 구성원 (방법function 및 속성property) 은 jQuery 실례에 모두 유효합니다. 
jQuery 코드를 보면 쉽게 찾을 수 있습니다.
jQuery.fn = jQuery.prototype = {
   init: function( selector, context ) {//.... 
};
원래 jQuery.fn = jQuery.prototype.
그래서, 그것은 jQuery에 대한 것이다.prototype 확장은 jQuery 클래스에 '구성원 함수' 를 추가하는 것입니다.jQuery 클래스의 실례는 이 '구성원 함수' 를 사용할 수 있습니다.
예를 들어 우리는 플러그인을 개발하여 특수한 편집 상자를 만들어야 한다. 이 플러그인이 눌렸을 때, 현재 편집 상자의 내용을 알 수 있다.다음을 수행할 수 있습니다.
$.fn.extend({               doAlertWhileClick:function() {                       $(this).click(function(){                                   alert($(this).val());                       });                 }       });       $("#input1").doAlertWhileClick();//페이지의 경우:
$("# input1") 은 jQuery 실례입니다. 구성원 방법인 DoAlertWhileClick을 호출하면 확장이 이루어집니다. 클릭할 때마다 현재 편집된 내용을 먼저 팝업합니다.
 
@@ JACK 12/03/2014

좋은 웹페이지 즐겨찾기