jquery 플러그 인 개발 방법 소결

jQuery 는 플러그 인 개발 을 위해 두 가지 방법 을 제시 했다.그것 이 바로 jQuery.fn.extend(object)이다.jQuery.extend(object); jQuery.extend(object); jQuery 클래스 자 체 를 확장 하기 위해 클래스 에 새로운 방법 을 추가 합 니 다.jQuery.fn.extend(object);jQuery 대상 에 게 방법 을 추가 합 니 다.fn 은 뭐 지?jQuery 코드 를 보면 어렵 지 않 습 니 다

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

원래 jQuery.fn=jQuery.prototype.prototype 에 낯 설 지 않 을 거 예요.자 바스 크 립 트 는 명확 한 클래스 개념 이 없 지만 클래스 로 이해 하 는 것 이 편리 합 니 다.jQuery 는 아주 잘 봉 인 된 클래스 입 니 다.예 를 들 어 우 리 는 구문$("\#btn 1")로 jQuery 류 의 인 스 턴 스 를 생 성 합 니 다.jQuery.extend(object);jQuery 클래스 에 클래스 를 추가 하 는 방법 은 정적 방법 을 추가 하 는 것 으로 이해 할 수 있 습 니 다.예 를 들 어

 
$.extend({ 
　　add:function(a,b){return a+b;} 
}); 

jQuery 에 add 라 는'정적 방법'을 추가 한 다음 에 jQuery 를 도입 하 는 곳 에서 이 방법 을 사용 할 수 있 습 니 다.$.add(3,4);/return 7 jQuery.fn.extend(object); jQuery.prototype 을 확장 하 는 것 은 jQuery 류 에'멤버 함수'를 추가 하 는 것 입 니 다.jQuery 클래스 의 인 스 턴 스 는 이"구성원 함수"를 사용 할 수 있 습 니 다.예 를 들 어 우 리 는 플러그 인 을 개발 하여 특수 한 편집 상 자 를 만 들 려 고 합 니 다.클릭 하면 alert 현재 편집 상자 의 내용 입 니 다.이렇게 할 수 있 습 니 다:자바 코드

 
$.fn.extend({ 
alertWhileClick:function(){ 
$(this).click(function(){ 
alert($(this).val()); 
}); 
} 
}); 
$("#input1").alertWhileClick(); //    ：<input id="input1" type="text"/> 
$.fn.extend({ 
alertWhileClick:function(){ 
$(this).click(function(){ 
alert($(this).val()); 
}); 
} 
}); 
$("#input1").alertWhileClick(); //    ：<input id="input1" type="text"/> 

$("\#input 1")는 jQuery 인 스 턴 스 입 니 다.구성원 방법 인 alert While Click 을 호출 하면 확장 이 이 루어 집 니 다.클릭 할 때마다 현재 편집 중인 내용 을 먼저 팝 업 합 니 다.실제 개발 과정 에서 이런 하 얀 플러그 인 을 만 들 지 는 않 을 것 입 니 다.사실은 jQuery 는 풍부 한 조작 문서,사건,CSS,Ajax,효과 적 인 방법 을 제시 하여 이런 방법 을 결합 하면 더욱 Niubility 의 플러그 인 을 개발 할 수 있 습 니 다.