[정수리] jQuery 막말(4)

7695 단어 jquery
jQuery 핵심 함수는 가장 중요한 jQuery () 외에 jQuery도 있습니다.holdReady()、jQuery.sub()、jQuery.when()、jQuery.noConflict().오늘은 제가 이 네 가지 방법을 소개하겠습니다.
우선 제이큐리.holdReady(), 코드에 직접 액세스하기
holdReady: function( hold ) { if ( hold ) { jQuery.readyWait++; // readyWait       ,                 
} else { jQuery.ready( true ); } }

사용 방법은 다음과 같습니다.
jQuery.holdReady( hold ) 
역할: 일시 정지 또는 회복.ready () 이벤트의 실행
매개 변수:hold는boolean 값으로 요청한ready 이벤트를 일시 정지하거나 복구할지 여부를 표시합니다
 
  jQuery.holdReady () 방법은 jQuery의 완성 이벤트를 이 함수에 잠그도록 합니다.이 고급 기능의 전형적인 응용 프로그램은 jQuery 플러그인 등 동적 스크립트를 불러오는 것입니다.추가 스크립트를 불러오기 전에 페이지가 준비되어 있어도 jQuery의 완료 이벤트는 터치되지 않습니다.이 함수는 페이지의 앞부분에서 호출되어야 합니다. 예를 들어 탭에서 jQuery가 다음 줄을 불러옵니다.이벤트가 트리거된 후에 이 함수를 호출해도 아무런 효과가 없습니다.사용 방법: 우선 $을 호출합니다.holdReady(true)[호출 후 완료 이벤트가 잠깁니다.]이벤트를 트리거할 준비가 되었을 때 $를 호출합니다.holdReady(false).주의해야 할 것은 완료 이벤트에 여러 개의 잠금을 추가할 수 있으며, 잠금마다 $가 대응합니다.holdReady(false)[잠금 해제] 호출.jQuery의 완료 이벤트는 모든 잠금이 해제되고 페이지가 준비된 상태에서 터치됩니다.실제적으로 동적 스크립트에 의존해야 하는 코드에 보안 자물쇠를 달아서, DOM 트리 구축이 성공한 후에 실행하는 것이 아니라, 필요한 동적 스크립트를 불러온 후에 준비된 이벤트를 실행합니다.
이 안에는 또 jQuery가 관련되어 있다.ready () 방법:
ready: function( wait ) { //         if ( wait === true ? --jQuery.readyWait : jQuery.isReady ) { return; } //      body    ,         IE“  ”         if ( !document.body ) { return setTimeout( jQuery.ready, 1 ); } // isReady      DOM              jQuery.isReady = true; //      ready    ,        ,               if ( wait !== true && --jQuery.readyWait > 0 ) { return; }   readyList.resolveWith( document, [ jQuery ] ); // Trigger any bound ready events         if ( jQuery.fn.trigger ) { jQuery( document ).trigger("ready").off("ready"); } }

여기 jQuery.ready() 및 jQuery(document).ready ()는 다릅니다.
  
이어서 jQuery를 분석합니다.sub () 방법.이 방법은 매개 변수를 받지 않습니다. 이 방법은 jQuery 복사본을 복사하고 원래의 jQuery 대상에 영향을 주지 않습니다.
jQuery.sub = function() { function jQuerySub( selector, context ) { return new jQuerySub.fn.init( selector, context ); } jQuery.extend( true, jQuerySub, this ); jQuerySub.superclass = this; jQuerySub.fn = jQuerySub.prototype = this(); jQuerySub.fn.constructor = jQuerySub; jQuerySub.sub = this.sub; jQuerySub.fn.init = function init( selector, context ) { if ( context && context instanceof jQuery && !(context instanceof jQuerySub) ) { context = jQuerySub( context ); } return jQuery.fn.init.call( this, selector, context, rootjQuerySub ); }; jQuerySub.fn.init.prototype = jQuerySub.fn; var rootjQuerySub = jQuerySub(document); return jQuerySub; };

  jQuery.이 방법은 주로 두 가지 특수한 상황에 사용된다. 첫 번째 상황은 jQuery 대상의 원생 방법을 오염시키지 않은 상황에서 jQuery 대상을 덮어쓰는 깨끗한 방식을 제공하는 것이다. 다른 하나는 개발자가 jQuery 플러그인을 봉인하고 이름 공간을 구축하는 데 도움을 주는 것이다.이 방법이 있으면 혼돈의 jQuery 플러그인 세계에서 자신만의 플러그인 모듈을 구축할 수 있다. 자신의 모듈이 오염되거나 자신의 플러그인이 다른 플러그인과 충돌할 염려가 없다. 그러나 몇 가지 주의해야 할 점이 있다. sub 대상의 모든 방법은 원생의 jQuery 대상을 가리킨다.또한 이벤트의 귀속과 발송, elments에 귀속된 데이터 항목은 전역적인 jQuery 대상을 거쳐야 하며, 이외에ajax 등도 있어야 한다는 것을 의미한다.이 방법의 내부 실현을 자세히 보면 축소판의 jQuery 대상 창설 과정과 비슷하다.이것은 우선 새로운function 대상을 초기화하여 코피 원생 jQuery 대상에 사용하고 원형 체인을 빌려sub 대상copy 원생 대상으로 하는 방법을 빌린 다음에 새로운document의 상하문 루트 jQuery Sub를 생성한다. 마지막으로 새로운 jQuery Sub 내부 초기화 방법에서 원생 init 방법을 호출하여 초기화한다. 이것은 jQuery 원생 대상의 창설 절차와 기본적으로 같다!
  
그리고 둘, 파이팅.jQuery.when () 방법은 하나 이상의 매개 변수를 받아들일 수 있습니다. 이 방법은 매개 변수 지연 대상의 리셋 함수를 실행하는 방법을 제공합니다. 매개 변수 지연 대상은 보통 비동기 이벤트를 나타냅니다.
when: function( subordinate /* , ..., subordinateN */ ) { var i = 0, resolveValues = core_slice.call( arguments ), length = resolveValues.length, // the count of uncompleted subordinates             remaining = length !== 1 || ( subordinate && jQuery.isFunction( subordinate.promise ) ) ? length : 0, // the master Deferred. If resolveValues consist of only a single Deferred, just use that.             deferred = remaining === 1 ? subordinate : jQuery.Deferred(), // Update function for both resolve and progress values             updateFunc = function( i, contexts, values ) { return function( value ) { contexts[ i ] = this; values[ i ] = arguments.length > 1 ? core_slice.call( arguments ) : value; if( values === progressValues ) { deferred.notifyWith( contexts, values ); } else if ( !( --remaining ) ) { deferred.resolveWith( contexts, values ); } }; }, progressValues, progressContexts, resolveContexts; // add listeners to Deferred subordinates; treat others as resolved         if ( length > 1 ) { progressValues = new Array( length ); progressContexts = new Array( length ); resolveContexts = new Array( length ); for ( ; i < length; i++ ) { if ( resolveValues[ i ] && jQuery.isFunction( resolveValues[ i ].promise ) ) { resolveValues[ i ].promise() .done( updateFunc( i, resolveContexts, resolveValues ) ) .fail( deferred.reject ) .progress( updateFunc( i, progressContexts, progressValues ) ); } else { --remaining; } } } // if we're not waiting on anything, resolve the master         if ( !remaining ) { deferred.resolveWith( resolveContexts, resolveValues ); } return deferred.promise(); }

이 코드는 나도 알 듯 모를 듯하기 때문에 구체적인 분석은 쓰지 않겠습니다. 깊이 이해하고 싶으면 참고하세요.http://cmc3.cn/n/249.html및http://nuysoft.iteye.com/blog/1174798
 
마지막 방법, jQuery.이름 충돌 문제를 해결하는 데 사용되는 noConflict()이 방법은 선택할 수 있는boolean 파라미터를 받아들입니다. 만약 이 파라미터=true라면 전역 변수 $와 전역 변수 jQuery의 제어권을 모두 양보합니다.매개 변수가 없거나 이 매개 변수=false가 없으면 전역 변수 $의 제어권만 양보합니다.
주: 전역 변수 jQuery의 제어권도 양보한다면 대부분의 플러그인이 jQuery에 존재하는 변수를 고려해야 합니다. 이런 경우 정상적으로 작동하지 못할 수도 있습니다.
noConflict: function( deep ) { if ( window.$ === jQuery ) { window.$ = _$; } if ( deep && window.jQuery === jQuery ) { window.jQuery = _jQuery; } return jQuery; }

코드는 설명하지 않겠습니다. 개인이면 알아볼 수 있으니 오늘은 여기까지 쓰겠습니다.

좋은 웹페이지 즐겨찾기