jquery 실현 원리 2:core.js
2470 단어 jquery원본 코드jquery 소스 분석
다음은 주요 코드 분석입니다.
jQuery 객체 구조 함수
jQuery = function( selector, context ) {
// The jQuery object is actually just the init constructor 'enhanced'
return new jQuery.fn.init( selector, context, rootjQuery );
},
jQuery 대상을 정의했는데, 실제로는 하나의 함수입니다. 이 함수는 new jQuery를 되돌려줍니다.fn.init( selector, context, rootjQuery );,그래서 jQuery의 대상은 jQuery입니다.fn.init 인스턴스
이원형
jquery의 원형은 바로 jQuery입니다.fn, 그래서 fn에 추가하는 방법은 모든 jquery 대상에서 직접 호출할 수 있으며, extend에 플러그인을 추가하는 것도 이 원리이다
관계식에 유의하십시오.
jQuery.fn = jQuery.prototype = jQuery.fn.init.prototype
jQuery.constructor = jQuery
jquery jQuery.fn.init
jQuery.fn = jQuery.prototype = { //
// The current version of jQuery being used
jquery: version,
constructor: jQuery, //
init: function( selector, context, rootjQuery ) {
// , init ,jQuery 。 , , root, root return new jQuery.fn.init( selector, context, rootjQuery ); , rootjQuery = jQuery( document );, , selector context。 rootjQuery ? window document,
// selector context , ,
//1, selector , jquery
//2, selector ,
//2.1, selector '<xxx>' , html , context plainObject html
//2.2, selector id , getElementById
//2.3, context , rootjQuery.find(selector), context jquery , context.find(selector)
//2.4, , context , $(context).find(selector)
//3, selector DOMElement, ,
//4, selector , documentready
//5, , {selector:xxx, context:xxx}, ,init
}
// selector length
// get, each, push
//fn
}
3 extend 방법
이 방법의 성명은 실제function extend([boolean deep], target, [obj1], [obj2]...)
첫 번째 파라미터는 선택할 수 있습니다. deepcopy 여부를 표시합니다.
만약 여러 개의 대상이 있다면, 두 번째와 그 다음의 모든 대상의 속성을 첫 번째 대상에 추가하고, 단지 하나의 대상만 있다면, 이 대상의 속성을 jQuery에 추가합니다.fn에서, 보통 우리가 플러그인을 쓰는 것은 이 방법을 사용하는 것이다.
이 방법의 실현은 비교적 간단하여 더 말할 필요가 없다
네 가지 extend로 한 무더기의 도구 방법을 넓혔다
포함
noconfilict:충돌 해결
isXXX:변수 유형 판단
parseHTML:html 세션 만들기
기다리다
다섯
마지막으로 new에 나온 jQuery 대상을 되돌려줍니다
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
jQuery 전후 예이 기사에서는 jquery after() 및 before() 메소드의 예를 볼 것입니다. before() 메서드는 선택한 요소 앞에 지정된 콘텐츠를 삽입합니다. after() 메서드는 선택한 요소 뒤에 지정된 콘텐츠...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.